<?php include('header.php');?>
<div class="container">
	<div class="row">
		<div class="span1">
			<div class="top50"></div>
			<div class="bar effect-1 show-sub main-background-color"></div>
			<div class="menu effect-1 show-sub main-font-color">
				<div class="main-font-color">Introduction<div class="menu-over-bar menu-introduction menu-over-bar-hover"></div><img src="<?=IMG_DIR?>/common/1px.png" class="menu-pointer menu-introduction" data-menu="introduction" /></div>
				<div class="main-font-color">Works<div class="menu-over-bar menu-works menu-over-bar-hover"></div><img src="<?=IMG_DIR?>/common/1px.png" class="menu-pointer menu-works" data-menu="works" /></div>
				<div class="main-font-color">Showreel<div class="menu-over-bar menu-showreel menu-over-bar-hover"></div><img src="<?=IMG_DIR?>/common/1px.png" class="menu-pointer menu-showreel" data-menu="showreel" /></div>
				<div class="main-font-color">Blog<div class="menu-over-bar menu-blog menu-over-bar-hover"></div><img src="<?=IMG_DIR?>/common/1px.png" class="menu-pointer menu-blog" data-menu="blog" /></div>
				<div class="main-font-color">Contact.<div class="menu-over-bar menu-contact menu-over-bar-hover"></div><img src="<?=IMG_DIR?>/common/1px.png" class="menu-pointer menu-contact" data-menu="contact" /></div>
			</div>
			<div class="bar effect-1 show-sub main-background-color"></div>
			<div class="project-careers effect-2 show-sub">
				<div class="project-request main-font-color">project request</div>
				<div class="careers main-font-color">careers</div>
			</div>
			<div class="bar effect-2 show-sub main-background-color"></div>
			<div class="logo effect-2 show-sub">
				<img class="logo-image main-image-color" src="<?=IMG_DIR?>/common/n_logo<?=$cover_default['image_color']?>.png">
			</div>
			<div class="works-content-category">
				<div class="works-content-category-title">Categories</div>
				<div class="works-content-category-title-bar"></div>
				<div  class="works-content-category-name"><span>All</span><div class="works-content-category-over-bar category-all works-content-category-over-bar-hover"></div><img src="<?=IMG_DIR?>/common/1px.png" class="category-pointer" data-menu="all" /></div>
				<div class="works-content-category-bar"></div>
			</div>
		</div>
		<div class="span1">
			<div class="main-content">
				<div class="top50"></div>
				<div class="bar effect-1 main-content-sub main-background-color"></div>
				<div class="cover-title-content">
					<ul class="read-more inline effect-4 main-content-sub">
						<li class="read-more-text main-font-color">read more</li>
						<li class="read-more-image"><img class="main-image-color" src="<?=IMG_DIR?>/main/more<?=$cover_default['image_color']?>.png"></li>
					</ul>
					<div class="cover-loading effect-1 main-font-color">
						<br />
						cover<br />
						loading
					</div>
					<?php $i=1; foreach($cover_rows as $row) :?>
					<?php if($i == 1) :?><div class="cover-title cover-title-page-<?=$i?> effect-4 main-content-sub main-font-color" data-link-url="<?=$row['link']?>" data-font-color="<?=$row['font_color']?>" data-font-type="<?=$row['font_type']?>" data-thumb-view="<?=$row['thumb_view']?>" data-image-type="<?=$row['type']?>" data-image-name="<?=$row['image_file_name']?>">
					<?php else :?><div class="cover-title cover-title-page cover-title-page-<?=$i?> main-font-color" data-link-url="<?=$row['link']?>" data-font-color="<?=$row['font_color']?>" data-font-type="<?=$row['font_type']?>" data-thumb-view="<?=$row['thumb_view']?>" data-image-type="<?=$row['type']?>" data-image-name="<?=$row['image_file_name']?>"><?php endif;?>
						<?=nl2br($row['title'])?>
					</div>
					<?php $i++; endforeach;?>
				</div>
				<div class="bar effect-1 main-content-sub main-background-color"></div>
				<ul class="cover-story inline effect-2 main-content-sub main-font-color">
					<li class="cover-story-text main-font-color">cover story</li>
					<li class="cover-story-paging"><div class="effect-4 main-content-sub"><img src="<?=IMG_DIR?>/main/icon_coverprev<?=$cover_default['image_color']?>.png" class="cover-story-page-prev main-image-color"> <span class="cover-story-page main-font-color"><span class="cover-story-page-current main-font-color">01</span>/<span class="cover-story-page-total main-font-color"><?=sprintf('%02d',$cover_total_rows)?></span></span> <img src="<?=IMG_DIR?>/main/icon_covernext<?=$cover_default['image_color']?>.png" class="cover-story-page-next main-image-color"></div></li>
				</ul>
				<div class="bar effect-2 main-content-sub main-background-color"></div>
			</div>
		</div>
		<div class="span1 offset2 effect-2 show-sub">
			<div class="top50"></div>
			<div class="bar main-background-color"></div>
			<ul class="search inline">
				<li class="search-image"><img class="main-image-color" src="<?=IMG_DIR?>/common/icon_search<?=$cover_default['image_color']?>.png"></li>
				<li class="search-text"><input class="main-font-color" type="text" value="search" /></li>		
			</ul>
			<div class="bar main-background-color"></div>
			<div class="percent-load-count effect-3">
				<div id="qLoverlay" class="load-count main-font-color"></div>
				<div class="bar hide-sub main-background-color"></div>
				<div class="percent-loaded hide-sub main-font-color">percent loaded</div>
			</div>
			<div class="blog-content-menu">
				<div class="blog-content-category">
					<div class="blog-content-category-title">Categories</div>
					<div class="blog-content-category-title-bar"></div>
					<div  class="blog-content-category-name"><span>All</span><div class="blog-content-category-over-bar category-all blog-content-category-over-bar-hover"></div><img src="<?=IMG_DIR?>/common/1px.png" class="category-pointer" data-menu="all" /></div>
					<div class="blog-content-category-bar"></div>
				</div>
				<div class="blog-content-archive">
					<div class="blog-content-archive-title">Archive</div>
					<div class="blog-content-archive-title-bar"></div>
				</div>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="span4 offset1 introduction-content content-container">
			<div class="content-body">
				<ul>
					<li><div class="bar"></div>
					<div class="introduction-title">Philosophy</div>
					<div class="left-row1">IF YOU CAN
					IMAGINE IT,
					YOU CAN
					MAKE IT.</div>
					<div class="bar"></div>
					<div class="left-row2">Founded in 2005 by a bunch of hungry 
					design addicts, Switch Media Works has 
					come to leave its mark as a top-notch 
					quality label in the field of animations 
					and graphics.</div>
					<div class="left-row3">With the same untiring drive and excitement 
					as back in the early days, we direct 
					and produce cutting-edge digital content 
					for our clients from the creative industries. 
					We count more than 30 design-obsessed 
					individuals that are united in their aspiration 
					to further push the boundaries of storytelling 
					by deploying narrative concepts that deliberately 
					blend commerce with art.</div>
					</li>
					<li><div class="bar"></div>
					<div class="introduction-title">Service</div>
					<div class="right-row right-row1">
						<ul>
						<li><img src="<?=IMG_DIR?>/introduction_2/icon_1.png"></li>
						<li><div class="right-title">Film</div>
						<div class="right-content">Commercial<br />
						Music Video<br />
						Promotion<br />
						Viral</div></li>
						</ul>
					</div>
					<div class="right-row right-row2">
						<ul>
						<li><img src="<?=IMG_DIR?>/introduction_2/icon_2.png"></li>
						<li><div class="right-title">Motion Graphic</div>
						<div class="right-content">Design Storytelling<br />
						Channel Network ID<br />
						Exhibition / Media Art<br />
						Game Trailer</div></li>
						</ul>
					</div>
					<div class="right-row right-row3">
						<ul>
						<li><img src="<?=IMG_DIR?>/introduction_2/icon_3.png"></li>
						<li><div class="right-title">Web</div>
						<div class="right-content">Web 3.0 Development<br />
						Social movie<br />
						Flash Interactive<br />
						Microsite</div></li>
						</ul>
					</div>
					<div class="right-row right-row4">
						<ul>
						<li><img src="<?=IMG_DIR?>/introduction_2/icon_4.png"></li>
						<li><div class="right-title">UX</div>
						<div class="right-content">UI / GUI strategy<br />
						Application<br />
						Mobile Web<br />
						New media</div></li>
						</ul>
					</div>
					</li>
				</ul>
			</div>
			<div class="content-footer"></div>
		</div>
	</div>
	<div class="row">
		<div class="span4 offset1 works-content content-container">
			<div class="content-body">
				<div class="works-top">
					<div class="works">WORKS</div>
					<div class="works-sub">We always intend to pursue new possibility with innovative design quality.</div>
					<div class="works-bar"></div>
				</div>
				<ul class="works-list">
					
				</ul>
				<ul class="works-list-more">
					<li class="works-list-more-text">read more</li>
					<li class="works-list-more-page"></li>
				</ul>
				<div class="works-list-more-image"><img src="<?=IMG_DIR?>/works/icon_readmore.png" /></div>
				<div class="works-list-bottom-top"><img src="<?=IMG_DIR?>/common_1/top.png" /></div>
				<div class="works-list-bottom-block"></div>
			</div>
			<div class="content-footer"></div>
		</div>
	</div>
	<div class="row">
		<div class="span4 offset1 contact-content  content-container">
			<div class="content-body">
				<div class="contact-top">
					<div class="contact">CONTACT</div>
					<div class="contact-sub">We are always ready to be your creative partner.<br />
					Please, knock our door, it would be our pleasure.</div>
					<ul class="contact-etc">
						<li class="contact-address">
							<div class="contact-bar"></div>
							<div class="contact-address-sub-1">
								4F Nuga BLDG, 115-6, Samsung-dong, GangNam-gu,<br />  
								Seoul, South Korea
							</div>
							<div class="contact-address-sub-2">
								<span class="contact-address-sub-2-1">T 02.512.8475</span> 
								<span class="contact-address-sub-2-2">F 02.512.8476</span>
							</div>
						</li>
						<li class="contact-email">
							<div class="contact-bar"></div>
							<div class="contact-email-sub-1">
								Project Inquiries <br />
								contact@switchmw.com
							</div>
							<div class="contact-email-sub-2">
								Job Inquiries<br />
	 							job@switchmw.com
	 						</div>
	 					</li>
						<li class="contact-qrcode">
							<div class="contact-bar"></div>
							<div class="contact-qrcode-sub-1">Google map</div>
							<div class="contact-qrcode-sub-2"><img src="<?=IMG_DIR?>/contact_1/qr.png"></div>
						</li>
					</ul>
				</div>
				<div id="contact_map" class="contact-map"></div>
			</div>
			<div class="content-footer"></div>
		</div>
	</div>
	<div class="row">
		<div class="span4 offset1 works-view-content content-container">
			<div class="content-body">
			</div>
			<div class="content-footer"></div>
		</div>
	</div>
	<div class="row">
		<div class="span4 offset1 blog-content content-container">
			<div class="content-body">
				<div class="blog-top">
					<div class="blog">SWITCH BLOG</div>
					<div class="blog-sub">We always have fun with playing design stuff in our life.<br />
					Let’s take a look with a cup of coffee.</div>
					<div class="blog-bar"></div>
				</div>
				<ul class="blog-list">
					
				</ul>
				<ul class="blog-list-more">
					<li class="blog-list-more-text">read more</li>
					<li class="blog-list-more-page"></li>
				</ul>
				<div class="blog-list-more-image"><img src="<?=IMG_DIR?>/works/icon_readmore.png" /></div>
				<div class="blog-list-bottom-top"><img src="<?=IMG_DIR?>/common_1/top.png" /></div>
				<div class="blog-list-bottom-block"></div>
			</div>
			<div class="content-footer"></div>
		</div>
	</div>
	<div class="row">
		<div class="span4 offset1 blog-view-page-content content-container">
			<div class="content-body">
				<div class="blog-top">
					<div class="blog">SWITCH BLOG</div>
					<div class="blog-sub">An ordinary day in Switch Mediaworks</div>
					<div class="blog-bar"></div>
				</div>
				<ul class="blog-list">
					
				</ul>
				<ul class="blog-list-back">
					<li class="blog-list-back-image"><img src="<?=IMG_DIR?>/common_1/icon_back.png" /></li>
					<li class="blog-list-back-text">back to list</li>
				</ul>
				<div class="blog-view-bottom-top"><img src="<?=IMG_DIR?>/common_1/top.png" /></div>
				<div class="blog-list-bottom-block"></div>
			</div>
			<div class="content-footer"></div>
		</div>
	</div>
	<div class="row">
		<div class="span4 offset1 main-footer-content content-container">
			<div class="content-body">
			</div>
			<div class="new-stuff-list">
				<div class="new-stuff main-font-color">New stuff</div>
				<div class="row">
				<?php foreach($main_rows as $row) :?>
					<div class="span1 new-stuff-content" data-view-kind="<?=$row['view_kind']?>" data-view-id="<?=$row['view_id']?>">
						<div class="new-stuff-bar main-background-color"></div>
						<div class="new-stuff-title main-font-color"><?=$row['title']?></div>
						<div class="new-stuff-image">
							<img class="new-stuff-image-image" src="<?=UPLOAD_DIR?>/<?=$row['image_file_name']?>" width="210px" height="190px">
							<div class="stuff-over-bar"><img src="<?=IMG_DIR?>/common/sum_bg.png" width="212px" height="171px"></div>
						</div>
					</div>
				<?php endforeach;?>
				</div>
			</div>
			<div class="main-content-footer"></div>
		</div>
	</div>
	<?php $i=1; foreach($cover_rows as $row) :?>
	<div class="div-bg div-textbg div-textbg-<?=$i?>"><img src="<?=UPLOAD_DIR?>/<?=$row['image_file_name']?>" data-image-width="<?=$row['image_image_width']?>" data-image-height="<?=$row['image_image_height']?>" data-cover-type="<?=$row['type']?>"></div>
	<?php $i++; endforeach;?>
	<div id="div_redbg" class="div-bg div-redbg"><img src="<?=IMG_DIR?>/common/main_redbg.png"></div>
	<div id="div_redbg_introduction" class="div-bg div-redbg"><img src="<?=IMG_DIR?>/common_1/bg_introduction.png"></div>
	<div id="div_redbg_works" class="div-bg div-redbg"><img src="<?=IMG_DIR?>/common_1/bg_works.png"></div>
	<div id="div_redbg_blog" class="div-bg div-redbg"><img src="<?=IMG_DIR?>/common_1/bg_blog.png"></div>
	<div id="div_redbg_contact" class="div-bg div-redbg"><img src="<?=IMG_DIR?>/common_1/bg_contact.png"></div>
	<div class="introduction-background">
		<div class="introduction-background-image"><img src="<?=IMG_DIR?>/introduction_2/Intro_BG_<?=$introduction_cover_default['current_page_text']?>.jpg" /></div>
	</div>
</div>
<div class="showreel-content">
	<div class="showreel-view">
		<div class="showreel-top"><img class="showreel-title" src="<?=IMG_DIR?>/showreel/showreel.png"><img class="showreel-x" src="<?=IMG_DIR?>/showreel/x.png"></div>
		<div class="showreel-movie"><iframe id="showreel-iframe" src="http://player.vimeo.com/video/61780058" width="800" height="450" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>  </div>
		<ul class="showreel-bottom">
			<li class="active">
				<div class="showreel-bar"></div><br />
				<span class="showreel-select" data-year="2013">showreel<br /><span class="year">2013</span></span>
			</li>
			<li>
				<div class="showreel-bar"></div><br />
				<span class="showreel-select" data-year="2010">showreel<br /><span class="year">2010</span></span>
			</li>
			<li>
				<div class="showreel-bar"></div><br />
				<span class="showreel-select" data-year="2007">showreel<br /><span class="year">2007</span></span>
			</li>
			<li class="showreel-bottom-last"><div class="showreel-bar-last"></div><br />
				Share this page <img class="showreel-facebook sns-scrap" data-view-id="2013" data-sns-type="facebook" src="<?=IMG_DIR?>/showreel/icon_f.png"><img class="showreel-twitter sns-scrap" data-view-id="2013" data-sns-type="twitter" src="<?=IMG_DIR?>/showreel/icon_t.png"></li>
		</div>
	</div>
</div>
<div class="project-content">
	<iframe name="actionIF" class="actionIF" width="0" height="0"></iframe>
	<form name="project_request_form" method="post" enctype="multipart/form-data" action="<?=base_url('main/project_request_write_action')?>" target="actionIF">
	<div class="project-view">
		<div class="project-view-navi">
			<ul>
				<li>PROJECT REQUEST</li>
				<li class="project-number number-1"><span>1</span></li>
				<li class="project-your-info">YOUR INFO</li>
				<li class="project-number number-2"><span>2</span></li> 
				<li class="project-your-project">YOUR PROJECT</li>
				<li class="project-number number-3"><span>3</span></li>
				<li class="project-project-type">PROJECT TYPE</li>
				<li class="project-close">CLOSE</li>
			</ul>
		</div>
		<div class="your-info">
			<ul class="line2">
				<li class="project-view-name">company name<div class="required-over-bar"><div class="over-bar"></div>required</div></li>
				<li class="project-view-value"><input class="project-input" name="company_name" type="text" value=""></li>
			</ul>
			<ul class="line">
				<li class="project-view-name">name<div class="required-over-bar"><div class="over-bar"></div>required</div></li>
				<li class="project-view-value"><input class="project-input" name="user_name" type="text" value=""></li>
			</ul>
			<ul class="line">
				<li class="project-view-name">e-mail address<div class="required-over-bar"><div class="over-bar"></div>required</div></li>
				<li class="project-view-value"><input class="project-input" name="email_address" type="text" value=""></li>
			</ul>
			<ul class="line">
				<li class="project-view-name">phone number<div class="required-over-bar"><div class="over-bar"></div>required</div></li>
				<li class="project-view-value"><input class="project-input" name="phone_number" type="text" value=""></li>
			</ul>
			<ul class="line">
				<li class="project-type-your-info">type your info</li>
			</ul>
		</div>
		<div class="your-project">
			<ul class="line2">
				<li class="project-kind project-kind-film"><input name="film" type="hidden" value="0"><span data-radio="film" data-click="off" ><img class="project-kind-check" src="<?=IMG_DIR?>/project_1/radio.png"> film</span></li>
				<li class="project-kind project-kind-motion"><input name="motion_graphic" type="hidden" value="0"><span data-radio="motion_graphic" data-click="off" ><img class="project-kind-check" src="<?=IMG_DIR?>/project_1/radio.png"> motion graphic</span></li>
				<li class="project-kind project-kind-ux"><input name="ux" type="hidden" value="0"><span data-radio="ux" data-click="off" ><img class="project-kind-check" src="<?=IMG_DIR?>/project_1/radio.png"> UX</span></li>
				<li class="project-kind project-kind-website"><input name="website" type="hidden" value="0"><span data-radio="website" data-click="off" ><img class="project-kind-check" src="<?=IMG_DIR?>/project_1/radio.png"> website</span></li>
				<li class="project-kind project-kind-etc"><input name="etc" type="hidden" value="0"><span data-radio="etc" data-click="off" ><img class="project-kind-check" src="<?=IMG_DIR?>/project_1/radio.png"> etc</span></li>
				<li class="project-comment">multi-selection is possible</li>
			</ul>
			<ul class="line">
				<li class="project-budget-name">project budget<div class="required-over-bar"><div class="over-bar step2"></div>required</div></li>
				<li class="project-budget-value">
					<div class="project-select">select</div>
					<ul class="project-option"><input name="budget" type="hidden" value="select">
						<li><span class="project-option-select">select</span><span class="project-select-unit">단위/만원</span><img src="<?=IMG_DIR?>/common/1px.png" class="option-pointer" data-option="select"></li>
						<li><span>3,000-6,000</span><img src="<?=IMG_DIR?>/common/1px.png" class="option-pointer" data-option="3000"></li>
						<li><span>6,000-10,000</span><img src="<?=IMG_DIR?>/common/1px.png" class="option-pointer" data-option="6000"></li>
						<li><span>10,000-20,000</span><img src="<?=IMG_DIR?>/common/1px.png" class="option-pointer" data-option="10000"></li>
						<li><span>20,000 over</span><img src="<?=IMG_DIR?>/common/1px.png" class="option-pointer" data-option="20000"></li>
					</ul>
				</li>
			</ul>
			<ul class="line">
				<li class="project-schedule-name">project schedule<div class="required-over-bar"><div class="over-bar step2"></div>required</div></li>
				<li class="project-schedule-value">
					<div class="project-select">select</div>
					<ul class="project-option"><input name="schedule" type="hidden" value="select">
						<li><span class="project-option-select">select</span><img src="<?=IMG_DIR?>/common/1px.png" class="option-pointer" data-option="select"></li>
						<li><span>1 month</span><img src="<?=IMG_DIR?>/common/1px.png" class="option-pointer" data-option="1"></li>
						<li><span>2-3 month</span><img src="<?=IMG_DIR?>/common/1px.png" class="option-pointer" data-option="2"></li>
						<li><span>4-5 month</span><img src="<?=IMG_DIR?>/common/1px.png" class="option-pointer" data-option="4"></li>
						<li><span>6 month over</span><img src="<?=IMG_DIR?>/common/1px.png" class="option-pointer" data-option="6"></li>
					</ul>
				</li>
			</ul>
			<ul class="line">
				<li><img src="<?=IMG_DIR?>/common/1px.png" /></li>
			</ul>
		</div>
		<div class="project-type">
			<ul class="line2">
				<li>add file<div class="required-over-bar"><div class="over-bar step3-1"></div>required</div></li>
				<li class="project-add-file">
					<div class="fileupload fileupload-new" data-provides="fileupload">
  						<div class="input-append">
    						<div class="uneditable-input span3"><span class="fileupload-preview"><span class="fileupload-find">find</span></span></div><span class="btn btn-file"><span class="fileupload-new">select</span><span class="fileupload-exists">change</span><input name="image" type="file" /></span>
  						</div>
					</div>
				</li>
				<li class="project-comment">maximum file size 20MB</li>
			</ul>
			<ul class="line">
				<li>comment<div class="required-over-bar"><div class="over-bar step3-2"></div>required</div></li>
				</li>
			</ul>
			<ul class="line">
				<li><textarea name="comment"></textarea></li>
			</ul>
			<ul class="line">
				<li><img src="<?=IMG_DIR?>/common/1px.png" /></li>
			</ul>
		</div>
		<div class="project-complete">
			<ul class="line2">
				<li>thank you.</li>
			</ul>
			<ul class="line">
				<li>we will contact you</li>
				</li>
			</ul>
			<ul class="line">
				<li>as soon as possible</li>
			</ul>
			<ul class="line">
				<li><img src="<?=IMG_DIR?>/common/1px.png" /></li>
			</ul>
			<ul class="line">
				<li><img src="<?=IMG_DIR?>/common/1px.png" /></li>
			</ul>
		</div>
		<div class="project-view-bottom-navi">
			<ul>
				<li class="project-prev"></li>
				<li class="project-next">next<img src="<?=IMG_DIR?>/project_1/bl_next.png"></li>
			</ul>
		</div>
	</div>
	</form>	
</div>
<div class="careers-content">
	<div class="careers-view">
		<div class="careers-view-navi">
			<ul>
				<li>CAREERS</li>
				<li class="careers-close">CLOSE</li>
			</ul>
		</div>
		<div class="careers-condition">
			<ul class="line2">
				<li><?=$careers_cover_default['careers_view_row']['content']?></li>
			</ul>
		</div>
		<div class="careers-view-bottom-navi"></div>
	</div>
</div>
<div class="showreel-content-black"></div>
<div class="project-content-black"></div>
<div class="careers-content-black"></div>
<script src="<?=JS_DIR?>/jquery-1.8.3.min.js"></script>
<script src="<?=JS_DIR?>/respond.min.js"></script>
<script src="<?=JU_DIR?>/js/jquery-ui-1.9.2.custom.min.js"></script>
<script src="<?=BS_DIR?>/js/bootstrap.min.js"></script>
<script src="<?=BS_DIR?>/js/bootstrap-fileupload.min.js"></script>
<script src="<?=JS_DIR?>/jquery.tmpl.min.js"></script>
<script src="<?=JS_DIR?>/jquery.queryloader2.customize.js"></script>
<script src="<?=JS_DIR?>/jquery.history.js"></script>
<script src="<?=JS_DIR?>/jquery.touchslider.min.js"></script>
<script src="<?=JS_DIR?>/smartpreload.js"></script>
<script src="<?=SM_DIR?>/script/soundmanager2-nodebug-jsmin.js"></script>
<script src="https://maps.google.com/maps/api/js?sensor=true"></script>
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=<?=$facebook_app_id?>";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<script> 
function sns_login_scrap(type, menu, category_id, view_id) {
	if(type == "facebook") {
		$.ajax({
			type: "post",
			url: "<?=base_url('main/sns_message')?>/"+type+"/"+menu+"/"+category_id+"/"+view_id,
			success: function(data) {
				FB.ui(data);
			},
			error: function(jqXHR, textStatus, errorThrown){
				//alert( errorThrown );
			}
		});
	}
	else {
		$.ajax({
			type: "post",
			url: "<?=base_url('main/sns_login_scrap')?>/"+type+"/"+menu+"/"+category_id+"/"+view_id,
			success: function(data) {
				if(data.status == "ok") alert("Scrap!");
				else swind("<?=base_url('main/sns_login')?>/"+type+"/"+menu+"/"+category_id+"/"+view_id, "600", "600");
			},
			error: function(jqXHR, textStatus, errorThrown){
				//alert( errorThrown );
			}
		});
	}
}
function swind(url, width, height) {
	size = 'width=' + width + ',height=' + height + ',top=' + 0 + ',left=' + 0;
	etc = size + ',resizable=no,scrollbars=no';
	window.open(url, '', etc);
}
</script>
<script>
var showreel_start_sound;
var showreel_end_sound;
var mouse_over_sound;
soundManager.setup({
  url: '<?=SM_DIR?>/swf/',
  flashVersion: 9,
  onready: function() {
	  showreel_start_sound = soundManager.createSound({
		  id: 'showreel_start_sound', // required
		  url: '<?=SD_DIR?>/sound_on_1.mp3', // required
		  // optional sound parameters here, see Sound Properties for full list
		  autoLoad: true,
		  volume: 50
		 });
	  showreel_end_sound = soundManager.createSound({
		  id: 'showreel_end_sound', // required
		  url: '<?=SD_DIR?>/sound_on_2.mp3', // required
		  // optional sound parameters here, see Sound Properties for full list
		  autoLoad: true,
		  volume: 50
		 });
	  mouse_over_sound = soundManager.createSound({
		  id: 'mouse_over_sound', // required
		  url: '<?=SD_DIR?>/bt_over03.mp3', // required
		  // optional sound parameters here, see Sound Properties for full list
		  type: 'audio/mp3',
		  autoLoad: true,
		  volume: 50,
		  stream: true
		 });
  }
});
</script>
<script>
var cover_interval;
var cover_interval_time = 10000;
var introduction_page = <?=$introduction_cover_default['current_page']?>;
var introduction_cover_interval;
var introduction_cover_interval_time = 3000;
var effect_duration = 300;
var effect_easing = "easeInOutQuart";
var text_basic_color = "";
var image_basic_color = "";
var load_count_check = true;
var move_complete_check = true;
var main_view_check = true;
var main_view_complete = false;
var current_state = {state: "main", depth: 1, view_id: 0, category_id: "", offset: 0, search: ""};
var before_state = {state: "main", depth: 1, view_id: 0, category_id: "", offset: 0, search: ""};
var project_request_step = 1;
var showreel_first = false;
var blog_view_first = false;
var work_total_rows = 0;
var blog_total_rows = 0;
var showreel_iframe_src = "http://player.vimeo.com/video/61780058";

function effect_2_show() {
	$(".effect-2").show( "blind", { direction: "left" }, effect_duration, load_count);
}
function load_count() {
	if(load_count_check) {
		$("body").queryLoader2({
	        percentage: true,
	        completeAnimation: "grow",
	        minimumTime: 100
	    });
		load_count_check = false;	
	}
}
function new_stuff_show() {
	<?php if($cover_default['thumb_view'] == "show") :?>$(".new-stuff-list").animate( {height: "269px"}, effect_duration, effect_easing);<?php endif;?>
	<?php if(!empty($careers_cover_default['careers_view'])) :?>careers_show();<?php endif;?>
	main_view_complete = true;
	
	cover_interval = setInterval(function() {cover_story_page("next")}, cover_interval_time);
}
function main_view() {
	if(main_view_check) {
		setTimeout(function() {
			$(".effect-3").hide( "blind", { direction: "left", duration: effect_duration, easing: effect_easing});
			<?php if($cover_default['type'] == "fixed") :?> $( "#div_redbg" ).show( "slide", { direction: "right", duration: 700, easing: effect_easing});<?php endif;?>
			setTimeout(function() {
				$( ".div-textbg-1" ).show( "slide", { direction: "right", duration: 700 , easing: effect_easing});
				<?php if($cover_default['type'] == "full") :?> $( "#div_redbg" ).show( "slide", { direction: "right", duration: 700, easing: effect_easing});<?php endif;?>
			}, 100);
			$(".cover-loading").hide( "slide", { direction: "left", duration: 700 , easing: effect_easing}, new_stuff_show);
			$(".effect-4").show( "slide", { direction: "right", duration: 700, easing: effect_easing });
		}, 500);
		main_view_check = false;
	}
}
function menu_hover_tall() {
	mouse_over_sound.play();
	$(this).parent().children(".menu-over-bar-hover").show( "slide", { direction: "left", duration: 100, easing: effect_easing });
}
function menu_hover_short() {
	mouse_over_sound.stop();
	$(".menu-over-bar-hover").hide( "slide", { direction: "left", duration: 100, easing: effect_easing });
}
function text_color_tall() {
	mouse_over_sound.play();
	text_basic_color = $(this).css("color");
	$(this).css("color", "#dc3924");
}
function text_color_short() {
	mouse_over_sound.stop();
	$(this).css("color", text_basic_color);
}
function image_color_tall() {
	mouse_over_sound.play();
	var image_src = $(this).attr("src");
	if(image_src.search("_white.png") != -1) {
		image_basic_color = "white";
		$(this).attr("src", image_src.replace("_white.png", "_over.png"));
	}
	else {
		image_basic_color = "";
		$(this).attr("src", image_src.replace(".png", "_over.png"));
	}
}
function image_color_short() {
	mouse_over_sound.stop();
	var image_src = $(this).attr("src");
	if(image_basic_color == "white") {
		$(this).attr("src", image_src.replace("_over.png", "_white.png"));
	}
	else {
		$(this).attr("src", image_src.replace("_over.png", ".png"));
	}
}
function showreel_image_color_tall() {
	mouse_over_sound.play();
	var image_src = $(this).attr("src");
	$(this).attr("src", image_src.replace(".png", "_over.png"));
}
function showreel_image_color_short() {
	mouse_over_sound.stop();
	var image_src = $(this).attr("src");
	$(this).attr("src", image_src.replace("_over.png", ".png"));
}
function sub_image_color_tall() {
	mouse_over_sound.play();
	var image_src = $(this).attr("src");
	$(this).attr("src", image_src.replace(".png", "_over.png"));
}
function sub_image_color_short() {
	mouse_over_sound.stop();
	var image_src = $(this).attr("src");
	$(this).attr("src", image_src.replace("_over.png", ".png"));
}
function cover_more_color_tall() {
	mouse_over_sound.play();
	 var $cover_text = $(this).children(".read-more-text");
	 text_basic_color = $cover_text.css("color");
	 $cover_text.css("color", "#dc3924");
	 
	 var $cover_image = $(this).children(".read-more-image").children("img");
	 var image_src = $cover_image.attr("src");
	 if(image_src.search("_white.png") != -1) {
		image_basic_color = "white";
		$cover_image.attr("src", image_src.replace("_white.png", "_over.png"));
	}
	else {
		image_basic_color = "";
		$cover_image.attr("src", image_src.replace(".png", "_over.png"));
	}
}
function cover_more_color_short() {
	mouse_over_sound.stop();
	var $cover_text = $(this).children(".read-more-text");
	$cover_text.css("color", text_basic_color);
	
	var $cover_image = $(this).children(".read-more-image").children("img");
	var image_src = $cover_image.attr("src");
	if(image_basic_color == "white") {
		$cover_image.attr("src", image_src.replace("_over.png", "_white.png"));
	}
	else {
		$cover_image.attr("src", image_src.replace("_over.png", ".png"));
	}
}
function stuff_hover_tall() {
	if(main_view_complete) {
		mouse_over_sound.play();
		$(this).children(".new-stuff-bar").stop().animate( {"width": "210px", "background-color": "#da3525"}, 100, effect_easing);
		$(this).children(".new-stuff-title").stop().animate( {"color": "#da3525"}, 100, effect_easing);
		//$(this).children(".new-stuff-image").children(".stuff-over-bar").show( "blind", { direction: "up", duration: 300, easing: effect_easing });
		$(this).children(".new-stuff-image").children(".stuff-over-bar").stop().animate( {"height": "171px"}, 200, effect_easing);
	}
}
function stuff_hover_short() {
	if(main_view_complete) {
		mouse_over_sound.stop();
		var page_current = parseInt($("span.cover-story-page-current").text());
		var font_color = $("div.cover-title-page-"+page_current).attr("data-font-color");
		var stuff_color = "";
		switch(font_color) {
			case "black":
				stuff_color = "#413839";
				break;
			case "white":
				stuff_color = "#ffffff";
				break;
			default :
				stuff_color = "#413839";
		}
		
		$(".new-stuff-bar").stop().animate( {"width": "27px", "background-color": stuff_color}, 100, effect_easing);
		$(".new-stuff-title").stop().animate( {"color": stuff_color}, 100, effect_easing);
		//$(".stuff-over-bar").hide( "blind", { direction: "down", duration: 300, easing: effect_easing });
		$(".stuff-over-bar").stop().animate( {"height": "0px"}, 200, effect_easing);
	}
}
function works_content_category_hover_tall() {
	mouse_over_sound.play();
	$(this).parent().children(".works-content-category-over-bar-hover").show( "slide", { direction: "left", duration: 100, easing: effect_easing });
}
function works_content_category_hover_short() {
	mouse_over_sound.stop();
	$(".works-content-category-over-bar-hover").hide( "slide", { direction: "left", duration: 100, easing: effect_easing });
}
function blog_content_category_hover_tall() {
	mouse_over_sound.play();
	$(this).parent().children(".blog-content-category-over-bar-hover").show( "slide", { direction: "left", duration: 100, easing: effect_easing });
}
function blog_content_category_hover_short() {
	mouse_over_sound.stop();
	$(".blog-content-category-over-bar-hover").hide( "slide", { direction: "left", duration: 100, easing: effect_easing });
}
function works_content_hover_tall() {
	mouse_over_sound.play();
	$(this).children(".works-content-bar").stop().animate( {"width": "210px", "background-color": "#da3525"}, 200, effect_easing);
	$(this).children(".works-content-title").stop().animate( {"color": "#da3525"}, 200, effect_easing);
	//$(this).children(".works-content-image").children(".works-content-over-bar").show( "blind", { direction: "up", duration: 200, easing: effect_easing });
	$(this).children(".works-content-image").children(".works-content-over-bar").stop().animate( {"height": "171px"}, 200, effect_easing);
}
function works_content_hover_short() {
	mouse_over_sound.stop();
	$(".works-content-bar").stop().animate( {"width": "27px", "background-color": "#413839"}, 200, effect_easing);
	$(".works-content-title").stop().animate( {"color": "#413839"}, 200, effect_easing);
	//$(".works-content-over-bar").hide( "blind", { direction: "down", duration: 200, easing: effect_easing });
	$(this).children(".works-content-image").children(".works-content-over-bar").stop().animate( {"height": "0px"}, 200, effect_easing);
}
function main_show() {
	$(".new-stuff-list").show( "slide", { direction: "left", duration: 700, easing: effect_easing });
	if($(".main-content-sub").css("display") == "none") {
		$(".main-content-sub").show( "blind", { direction: "left", duration: 700, easing: effect_easing });
	}
	$(".main-content").show( "blind", { direction: "left", duration: 700, easing: effect_easing }, main_footer_show);
	setTimeout(function() {$("#div_redbg").show( "slide", { direction: "left", duration: 700, easing: effect_easing});}, 200);

	var page_current = parseInt($("span.cover-story-page-current").text());
	$( ".div-textbg-"+page_current ).show( "slide", { direction: "left", duration: 700 , easing: effect_easing });
}
function main_footer_show() {
	$(".main-footer-content").css("z-index", 0);
	$(".main-content-footer").show( "slide", { direction: "down", duration: effect_duration , easing: effect_easing });

	cover_interval = setInterval(function() {cover_story_page("next")}, cover_interval_time);
}
function main_hide() {
	$(".new-stuff-list").hide( "slide", { direction: "left", duration: 700, easing: effect_easing });
	$(".main-content").hide( "blind", { direction: "left", duration: 700, easing: effect_easing });

	var page_current = parseInt($("span.cover-story-page-current").text());
	$( ".div-textbg-"+page_current ).hide( "slide", { direction: "left", duration: 700 , easing: effect_easing });

	$(".main-footer-content").css("z-index", -1);
	$(".main-content-footer").hide( "slide", { direction: "down", duration: effect_duration , easing: effect_easing });
	$("#div_redbg").hide( "slide", { direction: "left", duration: effect_duration, easing: effect_easing});
	clearInterval(cover_interval);
}
function footer_show() {
	$(".content-footer").show( "slide", { direction: "down", duration: effect_duration , easing: effect_easing }, works_list_bottom_top_view);
}
function works_list_bottom_top_view() {
	if(current_state.state == "works") $(".works-list-bottom-top").show();
	if(current_state.state == "blog") $(".blog-list-bottom-top").show();
}
function footer_hide() {
	$(".content-footer").hide();
	if(before_state.state == "works") $(".works-list-bottom-top").hide();
	if(before_state.state == "blog") $(".blog-list-bottom-top").hide();
}
function map_initialize() {
	var map;
	var center = new google.maps.LatLng(37.508364,127.045609);
	var switchmw = new google.maps.LatLng(37.511319,127.050203);
	var mapOptions = {
		minZoom: 8,
		maxZoom: 19,
		zoom: 15,
		center: center,
		disableDefaultUI: true,
		mapTypeId: google.maps.MapTypeId.ROADMAP
	};
	
	map = new google.maps.Map(document.getElementById("contact_map"), mapOptions);

	var marker=new google.maps.Marker({
		position: switchmw, 
		map: map,
		icon: {
			anchor: {
				x: 8, y: 72
			}, 
			url: "<?=IMG_DIR?>/contact_1/img_map.png", 
			size: {
				width: 64, height: 72
			} 
		}
	});
}
function image_load(offset) {
	var smartpreload_images = [];
	var smartpreload_images_key = [];
	$("div.works-content ul.works-list li[data-works-offset='"+offset+"'] .works-content-image-in").each(function() {
		smartpreload_images.push($(this).attr("src"));
	});
	$(document).smartpreload({ 
		images: smartpreload_images,
		onloadall: function() {
			$("div.works-content ul.works-list li[data-works-offset='"+offset+"'] .works-content-image-in").each(function(i) {
				$(this).parent().children(".works-content-load-image").delay(100*i).queue(function() { $(this).remove(); });
				$(this).delay(100*i).fadeIn();
			});
		}
    });
}
function image_load_all() {
	var smartpreload_images = [];
	var smartpreload_images_key = [];
	$("div.works-content ul.works-list li .works-content-image-in").each(function() {
		smartpreload_images.push($(this).attr("src"));
	});
	$(document).smartpreload({ 
		images: smartpreload_images,
		onloadall: function() {
			$("div.works-content ul.works-list li .works-content-image-in").each(function(i) {
				$(this).parent().children(".works-content-load-image").delay(100*i).queue(function() { $(this).remove(); });
				$(this).delay(100*i).fadeIn();
			});
		}
    });
}
function view_works_list(category_id, offset, search) {
	$.ajax({
		type: 'post',
		url: "<?=base_url('main/work')?>/"+category_id+"/"+offset,
		data: {
			search: search
		},
		success: function(data){
			work_total_rows = data.work_total_rows;
			var work_view_rows = parseInt(offset) + parseInt(data.limit);
			if(work_view_rows > data.work_total_rows) work_view_rows = data.work_total_rows; 
			$("#works_list").tmpl(data.work_rows).appendTo("ul.works-list");
			$("ul.works-list-more li.works-list-more-page").text(work_view_rows + "/" + data.work_total_rows);
			if(work_view_rows == parseInt(data.work_total_rows)) $(".works-list-more-image").hide();
			else  $(".works-list-more-image").show();
			$(".works-list-more-image").attr("data-offset", data.offset);
			$("div.works-content ul.works-list li[data-works-offset='"+offset+"']").hover( works_content_hover_tall, works_content_hover_short );
			image_load(offset);
		},
		error: function(jqXHR, textStatus, errorThrown){
			//alert( errorThrown );
		}
	});
}
function view_works_list_all(category_id, offset, search) {
	$.ajax({
		type: 'post',
		url: "<?=base_url('main/work')?>/"+category_id+"/"+offset,
		data: {
			type: "all",
			search: search
		},
		success: function(data){
			work_total_rows = data.work_total_rows;
			var work_view_rows = parseInt(offset) + parseInt(data.limit);
			if(work_view_rows > data.work_total_rows) work_view_rows = data.work_total_rows; 
			$("#works_list").tmpl(data.work_rows).appendTo("ul.works-list");
			$("ul.works-list-more li.works-list-more-page").text(work_view_rows + "/" + data.work_total_rows);
			if(work_view_rows == parseInt(data.work_total_rows)) $(".works-list-more-image").hide();
			else  $(".works-list-more-image").show();
			$(".works-list-more-image").attr("data-offset", data.offset);
			$("div.works-content ul.works-list li").hover( works_content_hover_tall, works_content_hover_short );
			image_load_all();
		},
		error: function(jqXHR, textStatus, errorThrown){
			//alert( errorThrown );
		}
	});
}
function view_works_list_back() {
	$("ul.works-list-more li.works-list-more-page").text(before_state.offset + "/" + work_total_rows);
	$(".works-list-more-image").show();
	$(".works-list-more-image").attr("data-offset", before_state.offset);
	$("ul.works-list li[data-works-offset='"+before_state.offset+"']").off('mouseenter').off('mouseleave');
	$("ul.works-list li[data-works-offset='"+before_state.offset+"']").remove();
}
function view_works_view(id) {
	$.ajax({
		type: 'post',
		url: "<?=base_url('main/work_view_security')?>/"+id,
		success: function(data) {
			if(data.result) view_works_view_in(data.id);
			else location.href = "<?=base_url()?>";
		},
		error: function(jqXHR, textStatus, errorThrown){
			//alert( errorThrown );
		}
	});
}
function view_works_view_in(id) {
	$.ajax({
		type: 'post',
		url: "<?=base_url('main/work_view')?>/"+id,
		data: {
			category_id: current_state.category_id,
			search: current_state.search
		},
		success: function(data){
			$("#works_view_content").tmpl(data.work_view_row).appendTo(".works-view-content .content-body");
			if(!data.work_view_new_id) {
				$(".works-list-newer-text span").hide();
				$(".works-list-newer-image img").hide();
			} 
			else {
				$(".works-list-newer-text span").show();
				$(".works-list-newer-image img").show();
			}
			if(!data.work_view_old_id) {
				$(".works-list-older-text span").hide();
				$(".works-list-older-image img").hide();
			}
			else {
				$(".works-list-older-text span").show();
				$(".works-list-older-image img").show();
			}
			$(".works-list-newer-text").attr("data-id", data.work_view_new_id);
			$(".works-list-older-text").attr("data-id", data.work_view_old_id);
			window.scrollTo(0,0);
		},
		error: function(jqXHR, textStatus, errorThrown){
			//alert( errorThrown );
		}
	});
}
function view_category_list() {
	$.ajax({
		type: 'post',
		url: "<?=base_url('main/work_category')?>",
		success: function(data){
			$("#works_content_category").tmpl(data.category_rows).appendTo(".works-content-category");
			works_content_over_bar_resize();
			$("div.works-content-category div.works-content-category-name img.category-pointer").hover( works_content_category_hover_tall, works_content_category_hover_short );
		},
		error: function(jqXHR, textStatus, errorThrown){
			//alert( errorThrown );
		}
	});
}
function view_blog_list(category_id, offset) {
	$.ajax({
		type: 'post',
		url: "<?=base_url('main/blog')?>/"+category_id+"/"+offset,
		success: function(data){
			blog_total_rows = data.blog_total_rows;
			var blog_view_rows = parseInt(offset) + parseInt(data.limit);
			if(blog_view_rows > data.blog_total_rows) blog_view_rows = data.blog_total_rows; 
			$("#blog_list").tmpl(data.blog_rows).appendTo(".blog-content ul.blog-list");
			$("ul.blog-list-more li.blog-list-more-page").text(blog_view_rows + "/" + data.blog_total_rows);
			if(blog_view_rows == parseInt(data.blog_total_rows)) $(".blog-list-more-image").hide();
			else  $(".blog-list-more-image").show();
			$(".blog-list-more-image").attr("data-offset", data.offset);
		},
		error: function(jqXHR, textStatus, errorThrown){
			//alert( errorThrown );
		}
	});
}
function view_blog_view(id) {
	$.ajax({
		type: 'post',
		url: "<?=base_url('main/blog_view')?>/"+id,
		success: function(data){
			$("#blog_view_content").tmpl(data.blog_view_row).appendTo(".blog-view-page-content ul.blog-list");
			window.scrollTo(0,0);
		},
		error: function(jqXHR, textStatus, errorThrown){
			//alert( errorThrown );
		}
	});
}
function view_blog_list_all(category_id, offset, search) {
	$.ajax({
		type: 'post',
		url: "<?=base_url('main/blog')?>/"+category_id+"/"+offset,
		data: {
			type: "all"
		},
		success: function(data){
			blog_total_rows = data.blog_total_rows;
			var blog_view_rows = parseInt(offset) + parseInt(data.limit);
			if(blog_view_rows > data.blog_total_rows) blog_view_rows = data.blog_total_rows; 
			$("#blog_list").tmpl(data.blog_rows).appendTo(".blog-content ul.blog-list");
			$("ul.blog-list-more li.blog-list-more-page").text(blog_view_rows + "/" + data.blog_total_rows);
			if(blog_view_rows == parseInt(data.blog_total_rows)) $(".blog-list-more-image").hide();
			else  $(".blog-list-more-image").show();
			$(".blog-list-more-image").attr("data-offset", data.offset);
			$("div.works-content ul.works-list li").hover( works_content_hover_tall, works_content_hover_short );
		},
		error: function(jqXHR, textStatus, errorThrown){
			//alert( errorThrown );
		}
	});
}
function view_blog_list_back() {
	$("ul.blog-list-more li.blog-list-more-page").text(before_state.offset + "/" + blog_total_rows);
	$(".blog-list-more-image").show();
	$(".blog-list-more-image").attr("data-offset", before_state.offset);
	$(".blog-content ul.blog-list li[data-blog-offset='"+before_state.offset+"']").off('mouseenter').off('mouseleave');
	$(".blog-content ul.blog-list li[data-blog-offset='"+before_state.offset+"']").remove();
}
function view_blog_category_list() {
	$.ajax({
		type: 'post',
		url: "<?=base_url('main/blog_category')?>",
		success: function(data){
			$("#blog_content_category").tmpl(data.category_rows).appendTo(".blog-content-category");
			blog_content_over_bar_resize();
			$("div.blog-content-category div.blog-content-category-name img.category-pointer").hover( blog_content_category_hover_tall, blog_content_category_hover_short );
		},
		error: function(jqXHR, textStatus, errorThrown){
			//alert( errorThrown );
		}
	});
}
function view_blog_archive_list(category_id) {
	$.ajax({
		type: 'post',
		url: "<?=base_url('main/blog_archive')?>/"+category_id,
		success: function(data){
			$(".blog-content-archive .blog-content-archive-name").remove();
			$(".blog-content-archive .blog-content-archive-bar").remove();
			$("#blog_content_archive").tmpl(data.archive_rows).appendTo(".blog-content-archive");
		},
		error: function(jqXHR, textStatus, errorThrown){
			//alert( errorThrown );
		}
	});
}
function gup( url, name ) {
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( url );
  if( results == null )
    return "";
  else
    return results[1];
}
function font_color_change(page_current, font_color) {
	if(!font_color) font_color = $("div.cover-title-page-"+page_current).attr("data-font-color");
	if(font_color == "black") {
		$(".main-font-color").animate({"color": "#413839", }, effect_duration, effect_easing);
		$(".main-background-color").animate({"background-color": "#413839", }, effect_duration, effect_easing);
		$(".main-image-color").animate({opacity: 1 }, 100, effect_easing, function() {
			var image_src = $(this).attr("src");
			if(image_src.search("_over.png") != -1) image_basic_color = "black";
			else if(image_src.search("_white.png") != -1) $(this).attr("src", image_src.replace("_white.png", ".png"));
		});
	}
	else if(font_color == "white") {
		$(".main-font-color").animate({"color": "#ffffff", }, effect_duration, effect_easing);
		$(".main-background-color").animate({"background-color": "#ffffff", }, effect_duration, effect_easing);
		$(".main-image-color").animate({opacity: 1 }, 100, effect_easing, function() {
			var image_src = $(this).attr("src");
			if(image_src.search("_over.png") != -1) image_basic_color = "white";
			else if(image_src.search("_white.png") == -1) $(this).attr("src", image_src.replace(".png", "_white.png"));
		});
	}
	else {
		$(".main-font-color").animate({"color": "#413839", }, effect_duration, effect_easing);
		$(".main-background-color").animate({"background-color": "#413839", }, effect_duration, effect_easing);
		$(".main-image-color").animate({opacity: 1 }, 100, effect_easing, function() {
			var image_src = $(this).attr("src");
			if(image_src.search("_over.png") != -1) image_basic_color = "black";
			else if(image_src.search("_white.png") != -1) $(this).attr("src", image_src.replace("_white.png", ".png"));
		});
	}
}
function thumb_view_change(page_before, page_current) {
	var current_thumb_view = $("div.cover-title-page-"+page_current).attr("data-thumb-view");
	var before_thumb_view = $("div.cover-title-page-"+page_before).attr("data-thumb-view");
	if(before_thumb_view != current_thumb_view) {
		if(current_thumb_view == "show") $(".new-stuff-list").animate( {height: "269px"}, effect_duration, effect_easing);
		else $(".new-stuff-list").animate( {height: "79px"}, effect_duration, effect_easing);
	}
}
function image_type_change(page_before, page_current) {
	var image_type = $("div.cover-title-page-"+page_current).attr("data-image-type");
	var image_name = $("div.cover-title-page-"+page_current).attr("data-image-name");

	$( ".div-textbg-"+page_before).hide( "fade", { duration: effect_duration , easing: effect_easing});
	$( ".div-textbg-"+page_current).show( "fade", {duration: effect_duration , easing: effect_easing});
}
function menu_over_bar_change(before_state_state, current_state_state, current_state_search) {
	if(before_state_state == "works-view") before_state_state = "works";
	if(before_state_state == "blog-view") before_state_state = "blog";

	if(current_state_state == "works-view") {
		current_state_state = "works";
		$("div.menu div div.menu-over-bar.menu-"+current_state_state).show( "slide", { direction: "left", duration: 100, easing: effect_easing });
	}
	else if(current_state_state == "blog-view") {
		current_state_state = "blog";
		$("div.menu div div.menu-over-bar.menu-"+current_state_state).show( "slide", { direction: "left", duration: 100, easing: effect_easing });
	}
	else if(current_state_state == "works" && current_state_search) {
		$("div.menu div div.menu-over-bar.menu-"+current_state_state).show( "slide", { direction: "left", duration: 100, easing: effect_easing });
	}
	else if(!before_state_state) {
		$("div.menu div div.menu-over-bar.menu-"+current_state_state).show( "slide", { direction: "left", duration: 100, easing: effect_easing });
	}
	else if(before_state_state == "main" && current_state_state == "blog") {
		$("div.menu div div.menu-over-bar.menu-"+current_state_state).show( "slide", { direction: "left", duration: 100, easing: effect_easing });
	}
	
	if(before_state_state != current_state_state) {
		if(before_state_state) $("div.menu div div.menu-over-bar.menu-"+before_state_state).hide().addClass("menu-over-bar-hover");
		$("div.menu div div.menu-over-bar.menu-"+current_state_state).removeClass("menu-over-bar-hover");
		$("div.menu div div.menu-over-bar.menu-"+current_state_state).show();
	}
}
function works_content_over_bar_change(before_state_category_id, current_state_category_id) {
	if(!current_state_category_id) $("div.works-content-category div.works-content-category-name div.works-content-category-over-bar.category-"+before_state_category_id).hide().addClass("works-content-category-over-bar-hover");
	else if(!before_state_category_id || current_state_category_id == "all") {
		$("div.works-content-category div.works-content-category-name div.works-content-category-over-bar.category-"+current_state_category_id).show( "slide", { direction: "left", duration: 100, easing: effect_easing });
	}
	
	if(before_state_category_id != current_state_category_id) {
		if(before_state_category_id) $("div.works-content-category div.works-content-category-name div.works-content-category-over-bar.category-"+before_state_category_id).hide().addClass("works-content-category-over-bar-hover");
		if(current_state_category_id) $("div.works-content-category div.works-content-category-name div.works-content-category-over-bar.category-"+current_state_category_id).removeClass("works-content-category-over-bar-hover");
		$("div.works-content-category div.works-content-category-name div.works-content-category-over-bar.category-"+current_state_category_id).show();
	}
}
function blog_content_over_bar_change(before_state_category_id, current_state_category_id) {
	if(!current_state_category_id) $("div.blog-content-category div.blog-content-category-name div.blog-content-category-over-bar.category-"+before_state_category_id).hide().addClass("blog-content-category-over-bar-hover");
	else if(!before_state_category_id || current_state_category_id == "all") {
		$("div.blog-content-category div.blog-content-category-name div.blog-content-category-over-bar.category-"+current_state_category_id).show( "slide", { direction: "left", duration: 100, easing: effect_easing });
	}
	
	if(before_state_category_id != current_state_category_id) {
		if(before_state_category_id) $("div.blog-content-category div.blog-content-category-name div.blog-content-category-over-bar.category-"+before_state_category_id).hide().addClass("blog-content-category-over-bar-hover");
		if(current_state_category_id) $("div.blog-content-category div.blog-content-category-name div.blog-content-category-over-bar.category-"+current_state_category_id).removeClass("blog-content-category-over-bar-hover");
		$("div.blog-content-category div.blog-content-category-name div.blog-content-category-over-bar.category-"+current_state_category_id).show();
	}
}
function works_content_over_bar_resize() {
	$("div.works-content-category div.works-content-category-name").each( function() {
		$(this).children("div.works-content-category-over-bar").css( "width" , $(this).children("span").width() + 5);	
	});
}
function blog_content_over_bar_resize() {
	$("div.blog-content-category div.blog-content-category-name").each( function() {
		$(this).children("div.blog-content-category-over-bar").css( "width" , $(this).children("span").width() + 5);	
	});
}
function div_textbg_image_resize(page_current) {
	if(!page_current) var page_current = parseInt($("span.cover-story-page-current").text());

	var $img = $( ".div-textbg-"+page_current+" img");

	if($img.attr("data-cover-type") == "full") {
		var body_height = $("body").height();
		var window_height = $(window).height();
		
		var max_width = $(window).width();
		var max_height = $(".main-footer-content").height();
		
		var view_height = max_height;
		if(view_height < window_height) view_height = window_height;
		
		var $div = $( ".div-textbg-"+page_current);
		
		if(body_height < window_height) max_height = window_height;
		var ratio = ($img.attr("data-image-height") / $img.attr("data-image-width"));
		
		var div_textbg_width = max_width;
		var div_textbg_height = Math.floor(max_width * ratio);
	
		if(div_textbg_height < max_height) {
			div_textbg_height = max_height;
			div_textbg_width = Math.floor(max_height / ratio);
		}
		
	    $img.css({width: div_textbg_width, height: div_textbg_height});

	    $div.css({height: view_height});
	}
}
function introduction_background_image_resize() {
	var body_height = $("body").height();
	var window_height = $(window).height();
	
	var max_height = $(".introduction-content").height();

	var view_height = max_height;
	if(view_height < window_height) view_height = window_height;

	$("div.introduction-background").css({"height": view_height});
	
	$("div.introduction-background div.introduction-background-image").css({"margin-left": ($(window).width() - 2560)/2});
	
}
function showreel_show() {
	$("#showreel-iframe")[0].contentWindow.location.replace(showreel_iframe_src);
	
	$("div.showreel-content").css("height", $(window).height());
	showreel_start_sound.play();
	setTimeout(function() {
		$(".showreel-content-black").show()
		.animate({opacity:'0.7'}, 10, "linear").animate({opacity:'0.4'}, 120, "linear")
		.animate({opacity:'0.7'}, 10, "linear").animate({opacity:'0.4'}, 280, "linear")
		.animate({opacity:'0.7'}, 10, "linear").animate({opacity:'0.4'}, 120, "linear").animate({opacity:'0.4'}, 30, "linear")
		.animate({opacity:'0.7'}, 10, "linear").animate({opacity:'0.4'}, 120, "linear").animate({opacity:'0.4'}, 30, "linear")
		.animate({opacity:'0.7'}, 10, "linear").animate({opacity:'0.4'}, 70, "linear")
		.animate({opacity:'0.7'}, 10, "linear").animate({opacity:'0.4'}, 70, "linear").animate({opacity:'0'}, 200, "linear")
		.animate({opacity:'1'}, 10, "linear").animate({opacity:'1'}, 400, "linear", function() {
			setTimeout(function() {
				showreel_end_sound.play();
				setTimeout(function() {
					$(".showreel-content").fadeIn();
					$("body div.container").hide();
				}, 200);
			}, 680);
		});
	}, 200);
}
function showreel_hide() {
	$(".showreel-content-black").hide();
	$(".showreel-content").hide();
	$("body div.container").show();
}
function cover_story_page(page_move) {
	
	var page_current = parseInt($("span.cover-story-page-current").text());
	var page_total = parseInt($("span.cover-story-page-total").text());
	
	if(page_move == "prev") {
		var page_before = page_current;
		if(page_current == 1) page_current = page_total;
		else page_current = page_current - 1;
	
		var page_current_text = page_current;
		if(page_current < 10) page_current_text = "0" + page_current;
		$("span.cover-story-page-current").text(page_current_text);
	
		div_textbg_image_resize(page_current);
		font_color_change(page_current, "");
		thumb_view_change(page_before, page_current);
		image_type_change(page_before, page_current);
		
		$("div.cover-title-page-"+page_before).hide( "slide", { direction: "right", duration: effect_duration , easing: effect_easing});
		$("div.cover-title-page-"+page_current).show( "slide", { direction: "left", duration: effect_duration , easing: effect_easing});
	}
	else {
		var page_before = page_current;
		if(page_current == page_total) page_current = 1;
		else page_current = page_current + 1;
	
		var page_current_text = page_current;
		if(page_current < 10) page_current_text = "0" + page_current;
		$("span.cover-story-page-current").text(page_current_text);
	
		div_textbg_image_resize(page_current);
		font_color_change(page_current, "");
		thumb_view_change(page_before, page_current);
		image_type_change(page_before, page_current);
		
		$("div.cover-title-page-"+page_before).hide( "slide", { direction: "left", duration: effect_duration , easing: effect_easing});
		$("div.cover-title-page-"+page_current).show( "slide", { direction: "right", duration: effect_duration , easing: effect_easing});
	}

	clearInterval(cover_interval);
	cover_interval = setInterval(function() {cover_story_page("next")}, cover_interval_time);
}
function introduction_cover_story_page() {
	introduction_page = introduction_page + 1;
	if(introduction_page > <?=$introduction_cover_default['total_page']?>) introduction_page = 1;
	var introduction_page_text = '';
	if(introduction_page < 10 ) introduction_page_text = '0' + introduction_page;
	else introduction_page_text = introduction_page;
	$("div.introduction-background-image img").attr("src", "<?=IMG_DIR?>/introduction_2/Intro_BG_"+introduction_page_text+".jpg");
}
function required_over_bar_hide() {
	setTimeout(function() {$("div.project-content div div.required-over-bar").hide();}, 3000);
}
function request_show() {
	if(project_request_step == 4) {
		$("div.project-content div.project-view div.project-view-navi ul li.project-close").css("color", "#473a3b");
		project_request_step = 1;
		$("div.project-content div.project-view div.project-complete").hide();
		$("div.project-content div.project-view div.your-info").show();
		$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-1").css("background", "url(<?=IMG_DIR?>/project_1/bg_red.png)");
		$("div.project-content div.project-view div.project-view-navi ul li.project-your-info").css("color", "#da3525");
		$("div.project-content div.project-view div.project-view-bottom-navi ul li.project-next").html('next<img src="<?=IMG_DIR?>/project_1/bl_next.png">').css("cursor", "pointer");
	}
}
function project_request_form_reset() {
	$("form[name='project_request_form']")[0].reset();
	$("input[name='film']").val(0);
	$("input[name='motion_graphic']").val(0);
	$("input[name='ux']").val(0);
	$("input[name='website']").val(0);
	$("input[name='etc']").val(0);
	$("input[name='budget']").val("select");
	$("input[name='schedule']").val("select");
	var $project_select = $("div.project-content div.project-view div.your-project ul li.project-kind span");
	$project_select.children("img").attr("src", "<?=IMG_DIR?>/project_1/radio.png");
	$project_select.css("color", "#473a3b");
	$project_select.attr("data-click", "off");
	var $project_select = $("div.project-content div.project-view div.your-project ul li.project-budget-value div.project-select");
	$project_select.css({"font-size": "44px", "color": "#473a3b"}).text("select");
	var $project_select = $("div.project-content div.project-view div.your-project ul li.project-schedule-value div.project-select");
	$project_select.css({"font-size": "44px", "color": "#473a3b"}).text("select");
}
function project_request_change(project_request_step_change) {
	switch(project_request_step) {
		case 2:
			$("div.project-content div.project-view div.your-project").hide( "slide", { direction: "right", duration: effect_duration , easing: effect_easing});
			$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-2").css("background", "url(<?=IMG_DIR?>/project_1/bg_brown.png)");
			$("div.project-content div.project-view div.project-view-navi ul li.project-your-project").css("color", "#473a3b");
			$("div.project-content div.project-view div.project-view-bottom-navi ul li.project-prev").empty().css("cursor", "");
			break;
		case 3:
			$("div.project-content div.project-view div.project-type").hide( "slide", { direction: "right", duration: effect_duration , easing: effect_easing});
			$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-3").css("background", "url(<?=IMG_DIR?>/project_1/bg_brown.png)");
			$("div.project-content div.project-view div.project-view-navi ul li.project-project-type").css("color", "#473a3b");
			$("div.project-content div.project-view div.project-view-bottom-navi ul li.project-next").html('next<img src="<?=IMG_DIR?>/project_1/bl_next.png">');
			break;
	}
	project_request_step = project_request_step_change;
	switch(project_request_step) {
		case 1:
			$("div.project-content div.project-view div.project-view-navi ul li.project-your-info").css("cursor", "").off("click");
			$("div.project-content div.project-view div.project-view-navi ul li.project-your-project").css("cursor", "").off("click");
			$("div.project-content div.project-view div.your-info").show( "slide", { direction: "left", duration: effect_duration , easing: effect_easing});
			$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-1").css("background", "url(<?=IMG_DIR?>/project_1/bg_red.png)");
			$("div.project-content div.project-view div.project-view-navi ul li.project-your-info").css("color", "#da3525");
			break;
		case 2:
			$("div.project-content div.project-view div.project-view-navi ul li.project-your-project").css("cursor", "").off("click");
			$("div.project-content div.project-view div.your-project").show( "slide", { direction: "left", duration: effect_duration , easing: effect_easing});
			$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-2").css("background", "url(<?=IMG_DIR?>/project_1/bg_red.png)");
			$("div.project-content div.project-view div.project-view-navi ul li.project-your-project").css("color", "#da3525");
			break;
	}
}
function careers_show() {
	var careers_height = 150 + <?=$careers_cover_default['careers_view_row']['height']?>;
	$("div.careers-content").css("height", careers_height);
	$("div.careers-content div.careers-view").css("height", careers_height);
	$("div.careers-content-black").css("height", $(document).height());
	$("div.careers-content-black").show().animate( {"top": careers_height}, effect_duration, effect_easing);
	$("div.careers-content").show( "slide", { direction: "up", duration: effect_duration , easing: effect_easing});
	$("div.content-container").animate( {"margin-top": careers_height}, effect_duration, effect_easing);
	$("div.top50").animate( {"margin-top": careers_height}, effect_duration, effect_easing);
	$("div.works-content-category").animate( {"margin-top": careers_height}, effect_duration, effect_easing);
	$("div.blog-content-menu").animate( {"margin-top": careers_height}, effect_duration, effect_easing);
	$("div.div-redbg").animate( {"margin-top": careers_height}, effect_duration, effect_easing);
	$("div.div-textbg").animate( {"margin-top": careers_height}, effect_duration, effect_easing);
	$("div.introduction-background").animate( {"margin-top": careers_height}, effect_duration, effect_easing);
}
$(function() {
	div_textbg_image_resize(0);
	view_category_list();
	view_blog_category_list();
	var State = History.getState();
	var menu_value = gup(State.url, "menu");
	var category_id_value = gup(State.url, "category-id");
	var view_id_value = gup(State.url, "view-id");
	var offset_value = gup(State.url, "offset");
	var search_value = gup(State.url, "search");
	if(!offset_value) offset_value = 0;
	if(!category_id_value) {
		view_works_list("all", 0, "");
		view_blog_list("all", 0);
		view_blog_archive_list("all");
	}
	else {
		view_works_list_all(category_id_value, offset_value, search_value);
		view_blog_list(category_id_value, 0);
		view_blog_archive_list(category_id_value);
	}
	$("#footer").tmpl().appendTo(".content-footer, .main-content-footer");
	switch(menu_value) {
		case "introduction": 
			font_color_change(1, "white");
			$(".hide-sub").hide();
			$(".show-sub").show();
			$("#div_redbg_introduction").show();
			
			introduction_background_image_resize();
			current_state = {state: 'introduction', depth: 2, view_id: 0, category_id: "", offset: 0, search: ""};
			History.pushState(current_state, "<?=SITE_TITLE?>", "?menu=introduction");
			menu_over_bar_change("", current_state.state, current_state.search);
			$(".introduction-background").show();
			$(".introduction-content").show();
			footer_show();
			introduction_cover_interval = setInterval(function() {introduction_cover_story_page()}, introduction_cover_interval_time);

			<?php if($cover_default['thumb_view'] == "show") :?>$(".new-stuff-list").css({height: "269px"});
			<?php else :?>$(".new-stuff-list").css({height: "79px"});<?php endif;?>

			<?php if(!empty($careers_cover_default['careers_view'])) :?>careers_show();<?php endif;?>
			main_view_complete = true;
			break;
		case "works": 
			font_color_change(1, "black");
			$(".hide-sub").hide();
			$(".show-sub").show();
			$("#div_redbg_works").show();

			current_state = {state: 'works', depth: 3, view_id: 0, category_id: category_id_value, offset: offset_value, search: search_value};
			History.pushState(current_state, "<?=SITE_TITLE?>", "?menu=works&category-id="+category_id_value+"&offset="+offset_value+"&search="+search_value);
			menu_over_bar_change("", current_state.state, current_state.search);
			setTimeout(function() {works_content_over_bar_change("", current_state.category_id);}, 500);
			$(".works-content").show();
			$(".works-content-category").show();
			footer_show();

			<?php if($cover_default['thumb_view'] == "show") :?>$(".new-stuff-list").css({height: "269px"});
			<?php else :?>$(".new-stuff-list").css({height: "79px"});<?php endif;?>

			<?php if(!empty($careers_cover_default['careers_view'])) :?>careers_show();<?php endif;?>
			main_view_complete = true;
			break;
		case "works-view": 
			font_color_change(1, "black");
			$(".hide-sub").hide();
			$(".show-sub").show();
			$("#div_redbg_works").show();

			current_state = {state: 'works-view', depth: 3, view_id: view_id_value, category_id: category_id_value, offset: offset_value, search: search_value};
			History.pushState(current_state, "<?=SITE_TITLE?>", "?menu=works-view&category-id="+category_id_value+"&view-id="+view_id_value+"&offset="+offset_value+"&search="+search_value);
			menu_over_bar_change("", current_state.state, current_state.search);
			setTimeout(function() {works_content_over_bar_change("", current_state.category_id);}, 500);
			view_works_view(view_id_value);
			$(".works-view-content").show();
			$(".works-content-category").show();
			footer_show();

			<?php if($cover_default['thumb_view'] == "show") :?>$(".new-stuff-list").css({height: "269px"});
			<?php else :?>$(".new-stuff-list").css({height: "79px"});<?php endif;?>

			<?php if(!empty($careers_cover_default['careers_view'])) :?>careers_show();<?php endif;?>
			main_view_complete = true;
			break;
		case "showreel":
			showreel_first = true;

			current_state = {state: 'showreel', depth: 4, view_id: 0, category_id: category_id_value, offset: 0, search: ""};
			History.pushState(current_state, "<?=SITE_TITLE?>", "?menu=showreel");
			
			$(".showreel-content").show();
			main_view_complete = true;
			break;
		case "blog": 
			font_color_change(1, "black");
			$(".hide-sub").hide();
			$(".show-sub").show();
			$("#div_redbg_blog").show();

			current_state = {state: 'blog', depth: 5, view_id: 0, category_id: category_id_value, offset: 0, search: ""};
			History.pushState(current_state, "<?=SITE_TITLE?>", "?menu=blog&category-id="+category_id_value);
			menu_over_bar_change("", current_state.state, current_state.search);
			setTimeout(function() {blog_content_over_bar_change("", current_state.category_id);}, 500);
			$(".blog-content").show();
			$(".blog-content-menu").show();
			footer_show();

			<?php if($cover_default['thumb_view'] == "show") :?>$(".new-stuff-list").css({height: "269px"});
			<?php else :?>$(".new-stuff-list").css({height: "79px"});<?php endif;?>

			<?php if(!empty($careers_cover_default['careers_view'])) :?>careers_show();<?php endif;?>
			main_view_complete = true;
			break;
		case "blog-view": 
			blog_view_first = true;
			font_color_change(1, "black");
			$(".hide-sub").hide();
			$(".show-sub").show();
			$("#div_redbg_blog").show();

			current_state = {state: 'blog-view', depth: 5, view_id: view_id_value, category_id: category_id_value, offset: 0, search: ""};
			History.pushState(current_state, "<?=SITE_TITLE?>", "?menu=blog-view&category-id="+category_id_value+"&view-id="+view_id_value);
			menu_over_bar_change("", current_state.state, current_state.search);
			setTimeout(function() {blog_content_over_bar_change("", current_state.category_id);}, 500);
			view_blog_view(view_id_value);
			$(".blog-view-page-content").show();
			$(".blog-content-menu").show();
			footer_show();

			<?php if($cover_default['thumb_view'] == "show") :?>$(".new-stuff-list").css({height: "269px"});
			<?php else :?>$(".new-stuff-list").css({height: "79px"});<?php endif;?>

			<?php if(!empty($careers_cover_default['careers_view'])) :?>careers_show();<?php endif;?>
			main_view_complete = true;
			break;
		case "contact": 
			font_color_change(1, "black");
			$(".hide-sub").hide();
			$(".show-sub").show();
			$( "#div_redbg_contact").show();

			current_state = {state: 'contact', depth: 6, view_id: 0, category_id: "", offset: 0, search: ""};
			History.pushState(current_state, "<?=SITE_TITLE?>", "?menu=contact");
			menu_over_bar_change("", current_state.state, current_state.search);
			$(".contact-content").show();
			map_initialize();
			footer_show();

			<?php if($cover_default['thumb_view'] == "show") :?>$(".new-stuff-list").css({height: "269px"});
			<?php else :?>$(".new-stuff-list").css({height: "79px"});<?php endif;?>

			<?php if(!empty($careers_cover_default['careers_view'])) :?>careers_show();<?php endif;?>
			main_view_complete = true;
			break;
		default :
			$(".main-footer-content").css("z-index", 0);
			$(".main-content-footer").show();
			$(".new-stuff-list").show();
			$(".effect-1").show( "blind", { direction: "left", duration: effect_duration, easing: effect_easing }, effect_2_show);
	}

	$(window).on("resize", function() {

		/* main */
		if(current_state.state == "main") {
			div_textbg_image_resize(0);
		}
		else if(current_state.state == "introduction") {
			introduction_background_image_resize();
		}
	}).trigger("resize");
	
	$(".menu div .menu-pointer").hover( menu_hover_tall, menu_hover_short );
	$(".project-careers .project-request").hover( text_color_tall, text_color_short );
	$(".project-careers .careers").hover( text_color_tall, text_color_short );
	$(".logo-image").hover( image_color_tall, image_color_short );
	$("div.works-content-category div.works-content-category-name img.category-pointer").hover( works_content_category_hover_tall, works_content_category_hover_short );
	$("img.cover-story-page-prev").hover( image_color_tall, image_color_short );
	$("img.cover-story-page-next").hover( image_color_tall, image_color_short );
	$(".read-more").hover( cover_more_color_tall, cover_more_color_short );
	$(document).on("mouseenter", "img.sns-scrap", sub_image_color_tall).on("mouseleave", "img.sns-scrap", sub_image_color_short);
	$(document).on("click", "img.sns-scrap", function() {
		if(current_state.state == 'showreel') sns_login_scrap($(this).attr("data-sns-type"), current_state.state, "all", $(this).attr("data-view-id"));
		else sns_login_scrap($(this).attr("data-sns-type"), current_state.state, current_state.category_id, $(this).attr("data-view-id"));
	});
	$(".footer-social .footer_f").on("click", function() {
		window.open("https://www.facebook.com/switchmwsns");
	});
	$(".footer-social .footer_t").on("click", function() {
		window.open("https://twitter.com/switchmwdev");
	});
	$(".footer-social .footer_v").on("click", function() {
		window.open("https://vimeo.com/switchmw");
	});
	$("li.read-more-text, li.read-more-image").on("click", function() {
		if(move_complete_check) {
			var page_current = parseInt($("span.cover-story-page-current").text());
			var link_url = $("div.cover-title-page-"+page_current).attr("data-link-url");
			if(link_url) {
				window.open(link_url);
			}
		}
	});
	$("img.cover-story-page-prev").on("click", function() {
		if(move_complete_check) {
			cover_story_page("prev");
		}
	});
	$("img.cover-story-page-next").on("click", function() {
		if(move_complete_check) {
			cover_story_page("next");
		}
	});
	$("div.new-stuff-list div div.new-stuff-content").hover( stuff_hover_tall, stuff_hover_short );
	$("div.new-stuff-list div div.new-stuff-content").on("click", function() {
		if(main_view_complete && move_complete_check) {
			if($(this).attr("data-view-kind") == "work") History.pushState({state: "works-view", depth: 3, view_id: $(this).attr("data-view-id"), category_id: "all", offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=works-view&category-id=all&view-id="+$(this).attr("data-view-id"));
			else if($(this).attr("data-view-kind") == "blog") History.pushState({state: "blog", depth: 5, view_id: 0, category_id: "all", offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=blog&category-id=all");
		}
	});
	$("img.menu-pointer").on("click", function() {
		if(main_view_complete && move_complete_check) {
			var menu = $(this).attr("data-menu");
			switch(menu) {
				case "introduction" :
					History.pushState({state: 'introduction', depth: 2, view_id: 0, category_id: "", offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=introduction");
					break;
				case "works" :
					History.pushState({state: 'works', depth: 3, view_id: 0, category_id: "all", offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=works&category-id=all");
					break;
				case "showreel" :
					History.pushState({state: 'showreel', depth: 4, view_id: 0, category_id: "", offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=showreel");
					break;
				case "blog" :
					History.pushState({state: 'blog', depth: 5, view_id: 0, category_id: "all", offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=blog&category-id=all");
					break;
				case "contact" :
					History.pushState({state: 'contact', depth: 6, view_id: 0, category_id: "", offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=contact");
					break;
				default :
			}  
		}
	});
	$("div.showreel-content div.showreel-view div.showreel-top img.showreel-x").hover(showreel_image_color_tall, showreel_image_color_short);
	$("div.showreel-content div.showreel-view div.showreel-top img.showreel-x").on("click", function() {
		if(showreel_first) {
			showreel_first = false;
			location.href = "<?=base_url()?>";
		}
		else History.back();
	});
	$("div.showreel-content div.showreel-view ul.showreel-bottom li span.showreel-select").on("click", function() {
		$("div.showreel-content div.showreel-view ul.showreel-bottom li").removeClass("active");
		$("div.showreel-content div.showreel-view .showreel-facebook").attr("data-view-id", $(this).attr("data-year"));
		$("div.showreel-content div.showreel-view .showreel-twitter").attr("data-view-id", $(this).attr("data-year"));
		$(this).parent().addClass("active");
		switch($(this).attr("data-year")) {
			case "2013":
				showreel_iframe_src = "http://player.vimeo.com/video/61780058";
				break;
			case "2010":
				showreel_iframe_src = "http://player.vimeo.com/video/61781239";
				break;
			case "2007":
				showreel_iframe_src = "http://player.vimeo.com/video/61781722";
				break;
		}
		$("#showreel-iframe")[0].contentWindow.location.replace(showreel_iframe_src);
	});
	$("div.project-careers div.careers").on("click", function() {
		careers_show();
	});
	$("div.careers-content li.careers-close").on("click", function() {
		$("div.careers-content-black").hide().animate( {"top": "0px"}, effect_duration, effect_easing);
		$("div.careers-content").hide( "slide", { direction: "up", duration: effect_duration , easing: effect_easing});
		$("div.content-container").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.top50").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.works-content-category").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.blog-content-menu").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.div-redbg").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.div-textbg").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.introduction-background").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
	});
	$("div.project-careers div.project-request").on("click", function() {
		$("div.project-content-black").css("height", $(document).height());
		$("div.project-content-black").show().animate( {"top": "371px"}, effect_duration, effect_easing);
		request_show();
		$("div.project-content").show( "slide", { direction: "up", duration: effect_duration , easing: effect_easing});
		if(project_request_step == 1) $("div.project-content input[name='company_name']").focus();
		$("div.content-container").animate( {"margin-top": "371px"}, effect_duration, effect_easing);
		$("div.top50").animate( {"margin-top": "371px"}, effect_duration, effect_easing);
		$("div.works-content-category").animate( {"margin-top": "371px"}, effect_duration, effect_easing);
		$("div.blog-content-menu").animate( {"margin-top": "371px"}, effect_duration, effect_easing);
		$("div.div-redbg").animate( {"margin-top": "371px"}, effect_duration, effect_easing);
		$("div.div-textbg").animate( {"margin-top": "371px"}, effect_duration, effect_easing);
		$("div.introduction-background").animate( {"margin-top": "371px"}, effect_duration, effect_easing);
	});
	$("div.project-content li.project-close").on("click", function() {
		$("div.project-content-black").hide().animate( {"top": "0px"}, effect_duration, effect_easing);
		$("div.project-content").hide( "slide", { direction: "up", duration: effect_duration , easing: effect_easing});
		$("div.content-container").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.top50").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.works-content-category").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.blog-content-menu").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.div-redbg").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.div-textbg").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
		$("div.introduction-background").animate( {"margin-top": "0px"}, effect_duration, effect_easing);
	});
	$("div.project-content div.project-view div.your-project ul li.project-kind span").on("click", function() {
		if($(this).attr("data-click") == "off") {
			$("input[name='"+$(this).attr("data-radio")+"']").val(1);
			$(this).children("img").attr("src", "<?=IMG_DIR?>/project_1/radio_on.png");
			$(this).css("color", "#da3525");
			$(this).attr("data-click", "on");
		}
		else {
			$("input[name='"+$(this).attr("data-radio")+"']").val(0);
			$(this).children("img").attr("src", "<?=IMG_DIR?>/project_1/radio.png");
			$(this).css("color", "#473a3b");
			$(this).attr("data-click", "off");
		}
	});
	$("div.project-content li.project-next").on("click", function() {
		switch(project_request_step) {
			case 1:
				var request_check = true;
				$("input[name='company_name']").val($.trim($("input[name='company_name']").val()));
				if(!$("input[name='company_name']").val()) {
					$("input[name='company_name']").parent().parent().children("li.project-view-name").children("div.required-over-bar").show();
					required_over_bar_hide();
					if(request_check) {
						$("input[name='company_name']").focus();
						request_check = false;
					}
				}
				$("input[name='user_name']").val($.trim($("input[name='user_name']").val()));
				if(!$("input[name='user_name']").val()) {
					$("input[name='user_name']").parent().parent().children("li.project-view-name").children("div.required-over-bar").show();
					required_over_bar_hide();
					if(request_check) {
						$("input[name='user_name']").focus();
						request_check = false;
					}
				}
				$("input[name='email_address']").val($.trim($("input[name='email_address']").val()));
				if(!$("input[name='email_address']").val()) {
					$("input[name='email_address']").parent().parent().children("li.project-view-name").children("div.required-over-bar").show();
					required_over_bar_hide();
					if(request_check) {
						$("input[name='email_address']").focus();
						request_check = false;
					}
				}
				$("input[name='phone_number']").val($.trim($("input[name='phone_number']").val()));
				if(!$("input[name='phone_number']").val()) {
					$("input[name='phone_number']").parent().parent().children("li.project-view-name").children("div.required-over-bar").show();
					required_over_bar_hide();
					if(request_check) {
						$("input[name='phone_number']").focus();
						request_check = false;
					}
				}
				if(!request_check) return;
				
				project_request_step = 2;
				$("div.project-content div.project-view div.your-info").hide( "slide", { direction: "left", duration: effect_duration , easing: effect_easing});
				$("div.project-content div.project-view div.your-project").show( "slide", { direction: "right", duration: effect_duration , easing: effect_easing});
				$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-1").css("background", "url(<?=IMG_DIR?>/project_1/bg_brown.png)");
				$("div.project-content div.project-view div.project-view-navi ul li.project-your-info").css("color", "#473a3b");
				$("div.project-content div.project-view div.project-view-navi ul li.project-your-info").css("cursor", "pointer").on("click", function() {
					project_request_change(1);
				});
				$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-2").css("background", "url(<?=IMG_DIR?>/project_1/bg_red.png)");
				$("div.project-content div.project-view div.project-view-navi ul li.project-your-project").css("color", "#da3525");
				$("div.project-content div.project-view div.project-view-bottom-navi ul li.project-prev").html('<img src="<?=IMG_DIR?>/project_1/bl_prev.png">prev').css("cursor", "pointer");
				break;
			case 2:
				var request_check = true;
				if($("input[name='budget']").val() == "select") {
					$("input[name='budget']").parent().parent().parent().children("li.project-budget-name").children("div.required-over-bar").show();
					required_over_bar_hide();
					if(request_check) request_check = false;
				}
				if($("input[name='schedule']").val() == "select") {
					$("input[name='schedule']").parent().parent().parent().children("li.project-schedule-name").children("div.required-over-bar").show();
					required_over_bar_hide();
					if(request_check) request_check = false;
				}
				if(!request_check) return;
				
				project_request_step = 3;
				$("div.project-content div.project-view div.your-project").hide( "slide", { direction: "left", duration: effect_duration , easing: effect_easing});
				$("div.project-content div.project-view div.project-type").show( "slide", { direction: "right", duration: effect_duration , easing: effect_easing});
				$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-2").css("background", "url(<?=IMG_DIR?>/project_1/bg_brown.png)");
				$("div.project-content div.project-view div.project-view-navi ul li.project-your-project").css("color", "#473a3b");
				$("div.project-content div.project-view div.project-view-navi ul li.project-your-project").css("cursor", "pointer").on("click", function() {
					project_request_change(2);
				});
				$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-3").css("background", "url(<?=IMG_DIR?>/project_1/bg_red.png)");
				$("div.project-content div.project-view div.project-view-navi ul li.project-project-type").css("color", "#da3525");
				$("div.project-content div.project-view div.project-view-bottom-navi ul li.project-next").html('submit');
				break;
			case 3:
				var request_check = true;
				if(!$("input[name='image']").val()) {
					$("div.project-content ul li.project-add-file").parent().children("li").children("div.required-over-bar").show();
					required_over_bar_hide();
					if(request_check) request_check = false;
				}
				if(!$("textarea[name='comment']").val()) {
					$("div.project-content div.over-bar.step3-2").parent("div.required-over-bar").show();
					required_over_bar_hide();
					if(request_check) request_check = false;
				}
				if(!request_check) return;
				$("form[name='project_request_form']")[0].submit();
				project_request_form_reset();
				
				project_request_step = 4;
				$("div.project-content div.project-view div.project-type").hide( "slide", { direction: "left", duration: effect_duration , easing: effect_easing});
				$("div.project-content div.project-view div.project-complete").show( "slide", { direction: "right", duration: effect_duration , easing: effect_easing});
				$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-3").css("background", "url(<?=IMG_DIR?>/project_1/bg_brown.png)");
				$("div.project-content div.project-view div.project-view-navi ul li.project-project-type").css("color", "#473a3b");
				$("div.project-content div.project-view div.project-view-navi ul li.project-close").css("color", "#da3525");
				$("div.project-content div.project-view div.project-view-bottom-navi ul li.project-prev").empty().css("cursor", "");
				$("div.project-content div.project-view div.project-view-bottom-navi ul li.project-next").empty().css("cursor", "");
				break;
		}
	});
	$("div.project-content li.project-prev").on("click", function() {
		switch(project_request_step) {
			case 2:
				project_request_step = 1;
				$("div.project-content div.project-view div.your-project").hide( "slide", { direction: "right", duration: effect_duration , easing: effect_easing});
				$("div.project-content div.project-view div.your-info").show( "slide", { direction: "left", duration: effect_duration , easing: effect_easing});
				$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-1").css("background", "url(<?=IMG_DIR?>/project_1/bg_red.png)");
				$("div.project-content div.project-view div.project-view-navi ul li.project-your-info").css("color", "#da3525");
				$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-2").css("background", "url(<?=IMG_DIR?>/project_1/bg_brown.png)");
				$("div.project-content div.project-view div.project-view-navi ul li.project-your-project").css("color", "#473a3b");
				$("div.project-content div.project-view div.project-view-bottom-navi ul li.project-prev").empty().css("cursor", "");
				break;
			case 3:
				project_request_step = 2;
				$("div.project-content div.project-view div.project-type").hide( "slide", { direction: "right", duration: effect_duration , easing: effect_easing});
				$("div.project-content div.project-view div.your-project").show( "slide", { direction: "left", duration: effect_duration , easing: effect_easing});
				$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-2").css("background", "url(<?=IMG_DIR?>/project_1/bg_red.png)");
				$("div.project-content div.project-view div.project-view-navi ul li.project-your-project").css("color", "#da3525");
				$("div.project-content div.project-view div.project-view-navi ul li.project-number.number-3").css("background", "url(<?=IMG_DIR?>/project_1/bg_brown.png)");
				$("div.project-content div.project-view div.project-view-navi ul li.project-project-type").css("color", "#473a3b");
				$("div.project-content div.project-view div.project-view-bottom-navi ul li.project-next").html('next<img src="<?=IMG_DIR?>/project_1/bl_next.png">');
				break;
		}
	});
	$("div.project-content div.project-view input.project-input").on("keydown", function() {
		$(this).parent().parent().children("li.project-view-name").children("div.required-over-bar").hide();
	});
	$("textarea[name='comment']").on("keydown", function() {
		$("div.project-content div.over-bar.step3-2").parent("div.required-over-bar").hide();
	});
	$("div.project-content div.project-view div.your-project ul li.project-budget-value div.project-select").on("click", function() {
		$("div.project-content div.project-view div.your-project ul li.project-budget-value ul.project-option").show( "slide", { direction: "up", duration: effect_duration , easing: effect_easing});
		$("div.project-content div.project-view div.your-project ul li.project-schedule-value ul.project-option").hide( "slide", { direction: "up", duration: effect_duration , easing: effect_easing});
	});
	$("div.project-content div.project-view div.your-project ul li.project-budget-value ul.project-option li img.option-pointer").on("click", function() {
		$("div.project-content div.project-view div.your-project ul li.project-budget-value ul.project-option").hide( "slide", { direction: "up", duration: effect_duration , easing: effect_easing});
		var $project_select = $("div.project-content div.project-view div.your-project ul li.project-budget-value div.project-select");
		$("input[name='budget']").val($(this).attr("data-option"));
		if($(this).attr("data-option") != "select") $("div.project-content div.project-view div.your-project ul li.project-budget-name div.required-over-bar").hide();
		switch($(this).attr("data-option")) {
			case "select":
				$project_select.css({"font-size": "44px", "color": "#473a3b"}).text("select");
				break;
			case "3000":
				$project_select.css({"font-size": "30px", "color": "#da3525"}).text("3,000-6,000");
				break;
			case "6000":
				$project_select.css({"font-size": "30px", "color": "#da3525"}).text("6,000-10,000");
				break;
			case "10000":
				$project_select.css({"font-size": "30px", "color": "#da3525"}).text("10,000-20,000");
				break;
			case "20000":
				$project_select.css({"font-size": "30px", "color": "#da3525"}).text("20,000 over");
				break;
		}
	});
	$("div.project-content div.project-view div.your-project ul li.project-schedule-value div.project-select").on("click", function() {
		$("div.project-content div.project-view div.your-project ul li.project-schedule-value ul.project-option").show( "slide", { direction: "up", duration: effect_duration , easing: effect_easing});
		$("div.project-content div.project-view div.your-project ul li.project-budget-value ul.project-option").hide( "slide", { direction: "up", duration: effect_duration , easing: effect_easing});
	});
	$("div.project-content div.project-view div.your-project ul li.project-schedule-value ul.project-option li img.option-pointer").on("click", function() {
		$("div.project-content div.project-view div.your-project ul li.project-schedule-value ul.project-option").hide( "slide", { direction: "up", duration: effect_duration , easing: effect_easing});
		var $project_select = $("div.project-content div.project-view div.your-project ul li.project-schedule-value div.project-select");
		$("input[name='schedule']").val($(this).attr("data-option"));
		if($(this).attr("data-option") != "select") $("div.project-content div.project-view div.your-project ul li.project-schedule-name div.required-over-bar").hide();
		switch($(this).attr("data-option")) {
			case "select":
				$project_select.css({"font-size": "44px", "color": "#473a3b"}).text("select");
				break;
			case "1":
				$project_select.css({"font-size": "30px", "color": "#da3525"}).text("1 month");
				break;
			case "2":
				$project_select.css({"font-size": "30px", "color": "#da3525"}).text("2-3 month");
				break;
			case "4":
				$project_select.css({"font-size": "30px", "color": "#da3525"}).text("4-5 month");
				break;
			case "6":
				$project_select.css({"font-size": "30px", "color": "#da3525"}).text("6 month over");
				break;
		}
	});
	$(".logo-image").on("click", function() {
		if(main_view_complete && move_complete_check) {
			if(current_state.state != "main") History.pushState({state: "main", depth: 1, view_id: 0, category_id: "", offset: 0, search: ""}, "<?=SITE_TITLE?>", "?");
		}
	});
	$(".touchslider").touchSlider({mouseTouch: false});
	$("div.our-space-page img.our-space-page-prev").on("click", function() {
		$(".touchslider").data("touchslider").prev();
		
		var our_space_page_current = parseInt($("div.our-space-page span.our-space-page-text span.our-space-page-current").text());
		if(our_space_page_current == 1) our_space_page_current = 10;
		else our_space_page_current--;

		if(our_space_page_current < 10) our_space_page_current = "0" + our_space_page_current;
		$("div.our-space-page span.our-space-page-text span.our-space-page-current").text(our_space_page_current);
	});
	$("div.our-space-page img.our-space-page-next").on("click", function() {
		$(".touchslider").data("touchslider").next();

		var our_space_page_current = parseInt($("div.our-space-page span.our-space-page-text span.our-space-page-current").text());
		if(our_space_page_current == 10) our_space_page_current = 1;
		else our_space_page_current++;

		if(our_space_page_current < 10) our_space_page_current = "0" + our_space_page_current;
		$("div.our-space-page span.our-space-page-text span.our-space-page-current").text(our_space_page_current);
	});
	$(document).on("click", "div.works-content ul.works-list li", function() {
		if(move_complete_check) {
			if($(this).attr("data-works-security") == "lock") {
				if($(this).children(".works-content-image").children(".works-content-key-box").css("display") == "none") {
					$(".works-content-key-box").hide();
					$(this).children(".works-content-image").children(".works-content-key-box").fadeIn();
					$(this).children(".works-content-image").children(".works-content-key-box").children(".works-content-key-box-input").children("input").focus();
				}
			}
			else History.pushState({state: "works-view", depth: 3, view_id: $(this).attr("data-works-id"), category_id: current_state.category_id, offset: current_state.offset, search: current_state.search}, "<?=SITE_TITLE?>", "?menu=works-view&category-id="+current_state.category_id+"&view-id="+$(this).attr("data-works-id")+"&offset="+current_state.offset+"&search="+current_state.search);
		}
	});
	$(document).on("click", "div.works-list-more-image", function() {
		if(move_complete_check) {
			if(current_state.search) History.pushState({state: 'works', depth: 3, view_id: 0, category_id: current_state.category_id, offset: $(this).attr("data-offset"), search: current_state.search}, "<?=SITE_TITLE?>", "?menu=works&category-id="+current_state.category_id+"&offset="+$(this).attr("data-offset")+"&search="+current_state.search);
			else History.pushState({state: 'works', depth: 3, view_id: 0, category_id: current_state.category_id, offset: $(this).attr("data-offset"), search: ""}, "<?=SITE_TITLE?>", "?menu=works&category-id="+current_state.category_id+"&offset="+$(this).attr("data-offset"));
		}
	});
	$(document).on("click", "div.blog-content ul.blog-list li div.blog-view-title", function() {
		if(move_complete_check) History.pushState({state: "blog-view", depth: 5, view_id: $(this).parent().attr("data-blog-id"), category_id: current_state.category_id, offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=blog-view&category-id="+current_state.category_id+"&view-id="+$(this).parent().attr("data-blog-id"));
	});
	$(document).on("click", "div.blog-list-more-image", function() {
		if(move_complete_check) {
			History.pushState({state: 'blog', depth: 5, view_id: 0, category_id: current_state.category_id, offset: $(this).attr("data-offset"), search: ""}, "<?=SITE_TITLE?>", "?menu=blog&category-id="+current_state.category_id+"&offset="+$(this).attr("data-offset"));
		}
	});
	$(document).on("click", "li.blog-list-back-text", function() {
		if(move_complete_check) {
			if(blog_view_first) {
				blog_view_first = false;
				location.href = "<?=base_url()?>?menu=blog&category-id="+current_state.category_id;
			}
			else History.back();
		}
	});
	$(document).on("click", "li.works-list-back-text", function() {
		if(move_complete_check) {
			History.pushState({state: 'works', depth: 3, view_id: 0, category_id: current_state.category_id, offset: current_state.offset, search: current_state.search}, "<?=SITE_TITLE?>", "?menu=works&category-id="+current_state.category_id+"&offset="+current_state.offset+"&search="+current_state.search);
		}
	});
	$(document).on("click", "li.works-list-newer-text", function() {
		if(move_complete_check) {
			History.pushState({state: 'works-view', depth: 3, view_id: $(this).attr("data-id"), category_id: current_state.category_id, offset: current_state.offset, search: current_state.search}, "<?=SITE_TITLE?>", "?menu=works-view&category-id="+current_state.category_id+"&view-id="+$(this).attr("data-id")+"&offset="+current_state.offset+"&search="+current_state.search);
		}
	});
	$(document).on("click", "li.works-list-older-text", function() {
		if(move_complete_check) {
			History.pushState({state: 'works-view', depth: 3, view_id: $(this).attr("data-id"), category_id: current_state.category_id, offset: current_state.offset, search: current_state.search}, "<?=SITE_TITLE?>", "?menu=works-view&category-id="+current_state.category_id+"&view-id="+$(this).attr("data-id")+"&offset="+current_state.offset+"&search="+current_state.search);
		}
	});
	$(document).on("click", ".works-view-relation-img", function() {
		History.pushState({state: 'works-view', depth: 3, view_id: $(this).attr("data-id"), category_id: current_state.category_id, offset: current_state.offset, search: current_state.search}, "<?=SITE_TITLE?>", "?menu=works-view&category-id="+current_state.category_id+"&view-id="+$(this).attr("data-id")+"&offset="+current_state.offset+"&search="+current_state.search);
	});
	$(".works-list-bottom-top img").on("click", function() {
		$('body').animate({scrollTop : 0}, 500, effect_easing);
	});
	$(document).on("click", ".works-view-bottom-top img", function() {
		$('body').animate({scrollTop : 0}, 500, effect_easing);
	});
	$(".blog-list-bottom-top img").on("click", function() {
		$('body').animate({scrollTop : 0}, 500, effect_easing);
	});
	$(".blog-view-bottom-top img").on("click", function() {
		$('body').animate({scrollTop : 0}, 500, effect_easing);
	});
	$(document).on("click", "div.works-content-category div.works-content-category-name img.category-pointer", function() {
		if(move_complete_check) History.pushState({state: 'works', depth: 3, view_id: 0, category_id: $(this).attr("data-menu"), offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=works&category-id="+$(this).attr("data-menu"));
	});
	$(document).on("click", "div.blog-content-category div.blog-content-category-name img.category-pointer", function() {
		if(move_complete_check) History.pushState({state: 'blog', depth: 5, view_id: 0, category_id: $(this).attr("data-menu"), offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=blog&category-id="+$(this).attr("data-menu"));
	});
	$(document).on("click", ".works-content-key-box-close img", function() {
		$(this).parent().parent().fadeOut();
	});
	$(document).on("click", ".works-content-key-box-input span", function() {
		$.ajax({
			type: 'post',
			url: "<?=base_url('main/work_security')?>/"+$(this).parent().parent().parent().parent().attr("data-works-id"),
			data: {
				password: $(this).parent().children("input").val()
			},
			success: function(data) {
				$(".works-content-key-box-input input").val("");
				$(".works-content-key-box").hide();
				if(data.result) {
					History.pushState({state: "works-view", depth: 3, view_id: data.id, category_id: current_state.category_id, offset: current_state.offset, search: current_state.search}, "<?=SITE_TITLE?>", "?menu=works-view&category-id="+current_state.category_id+"&view-id="+data.id+"&offset="+current_state.offset+"&search="+current_state.search);
				}
			},
			error: function(jqXHR, textStatus, errorThrown){
				//alert( errorThrown );
			}
		});
	});
	$(".search-text input").on("click", function() {
		if($(this).val() == "search") $(this).val("");
		$(".search").animate({ top: "10px", height: "33px"}, effect_duration, effect_easing);
	});
	$(".search-text input").on("keyup", function(e) {
		if(main_view_complete && move_complete_check) {
			if(e.keyCode == 13) {
				History.pushState({state: 'works', depth: 3, view_id: 0, category_id: "all", offset: 0, search: $(this).val()}, "<?=SITE_TITLE?>", "?menu=works&category-id=all&search="+$(this).val());
			}
		}
	});
	$(document).on("click", ".works-view-content .content-body ul.works-view-etc li.works-view-category span", function() {
		if(current_state.category_id == $(this).attr("data-id")) History.pushState({state: 'works', depth: 3, view_id: 0, category_id: $(this).attr("data-id"), offset: current_state.offset, search: ""}, "<?=SITE_TITLE?>", "?menu=works&category-id="+$(this).attr("data-id")+"&offset="+current_state.offset);
		else History.pushState({state: 'works', depth: 3, view_id: 0, category_id: $(this).attr("data-id"), offset: 0, search: ""}, "<?=SITE_TITLE?>", "?menu=works&category-id="+$(this).attr("data-id"));
		
	});
	$(document).on("click", ".works-view-content .content-body ul.works-view-etc li.works-view-tag span", function() {
		if(current_state.search == $(this).attr("data-id")) History.pushState({state: 'works', depth: 3, view_id: 0, category_id: "all", offset: current_state.offset, search: $(this).attr("data-id")}, "<?=SITE_TITLE?>", "?menu=works&category-id=all&offset="+current_state.offset+"&search="+$(this).attr("data-id"));
		else History.pushState({state: 'works', depth: 3, view_id: 0, category_id: "all", offset: 0, search: $(this).attr("data-id")}, "<?=SITE_TITLE?>", "?menu=works&category-id=all&search="+$(this).attr("data-id"));
		$(".search-text input").val($(this).attr("data-id"));
		$(".search").animate({ top: "10px", height: "33px"}, effect_duration, effect_easing);
	});
	History.Adapter.bind(window, 'statechange', function(){
		var State = History.getState();
		
		before_state = current_state;
		if(!$.isEmptyObject(State.data)) {
			var view_id = 0;
			var category_id = "";
			var offset = 0;
			var search = "";
			if(State.data.view_id) view_id = State.data.view_id;
			if(State.data.category_id) category_id = State.data.category_id;
			if(State.data.offset) offset = parseInt(State.data.offset); 
			if(State.data.search) search = State.data.search;
			current_state = {state: State.data.state, depth: State.data.depth, view_id: view_id, category_id: category_id, offset: offset, search: search};
		}
		else current_state = {state: "main", depth: 1, view_id: 0, category_id: "", offset: 0, search: ""};

		if(!current_state.search) {
			$(".search").animate({ top: "5px", height: "23px"}, effect_duration, effect_easing);
			$(".search-text input").val("search");
		}

		if(current_state.state == 'showreel') showreel_show();
		else if(before_state.state == 'showreel') showreel_hide();
		else {
			if(before_state.state != current_state.state) {
				move_complete_check = false;
	
				menu_over_bar_change(before_state.state, current_state.state, current_state.search);
				if(before_state.state == "works-view" || before_state.state == "works" || current_state.state == "works-view" || current_state.state == "works") {
					works_content_over_bar_change(before_state.category_id, current_state.category_id);
				}
				if(before_state.state == "blog-view" || before_state.state == "blog" || current_state.state == "blog-view" || current_state.state == "blog") {
					blog_content_over_bar_change(before_state.category_id, current_state.category_id);
				}
				
				var load_time = 500;
				
				if(current_state.state == "works-view") view_works_view(current_state.view_id);
				else if(before_state.state != "works-view" && current_state.state == "works") {
					$("ul.works-list").empty();
					view_works_list(current_state.category_id, 0, current_state.search);
				}
				else if(before_state.state == "works-view" && current_state.state == "works" && (before_state.category_id !=current_state.category_id || before_state.search !=current_state.search || before_state.offset !=current_state.offset)) {
					$("ul.works-list").empty();
					view_works_list(current_state.category_id, 0, current_state.search);
				}
				else if(current_state.state == "blog-view") view_blog_view(current_state.view_id);
				else if(before_state.state != "blog-view" && current_state.state == "blog") {
					$(".blog-content ul.blog-list").empty();
					view_blog_list(current_state.category_id, 0);
				}
				else if(before_state.state == "blog-view" && current_state.state == "blog" && before_state.category_id !=current_state.category_id) {
					$(".blog-content ul.blog-list").empty();
					view_blog_list(current_state.category_id, 0);
				}
	
				if(current_state.state == "main") {
					setTimeout(function() {
						var page_current = parseInt($("span.cover-story-page-current").text());
						font_color_change(page_current, "");
					}, load_time);
				}
				else if(current_state.state == "introduction") {
					setTimeout(function() {
						introduction_background_image_resize();
						var page_current = parseInt($("span.cover-story-page-current").text());
						font_color_change(page_current, "white");
						var direction = "right"; 
						if(before_state.depth > current_state.depth) direction = "left";
						$(".introduction-background").show( "slide", { direction: direction, duration: 700 , easing: effect_easing});
						introduction_cover_interval = setInterval(function() {introduction_cover_story_page()}, introduction_cover_interval_time);
					}, load_time - 200);
				}
				else {
					setTimeout(function() {
						var page_current = parseInt($("span.cover-story-page-current").text());
						font_color_change(page_current, "black");
					}, load_time);
				}
				
				if(before_state.state == "introduction") {
					clearInterval(introduction_cover_interval);
					setTimeout(function() {
						var direction = "left"; 
						if(before_state.depth > current_state.depth) direction = "right";
						$(".introduction-background").hide( "slide", { direction: direction, duration: 700 , easing: effect_easing});
					}, load_time + 150);
				}
				
				setTimeout(function() {
					if(before_state.state == "works") works_content_hover_short();
					
					if(before_state.state == "main") main_hide(); 
					else {
						if(before_state.depth == current_state.depth) {
							if(before_state.state == "blog-view") $(".blog-view-page-content").hide();
							else $("."+before_state.state+"-content").hide();
							footer_hide();
						}
						else {
							var direction = "left"; 
							if(before_state.depth > current_state.depth) direction = "right";
							
							footer_hide();
							if(before_state.state == "blog-view") $(".blog-view-page-content").hide( "slide", { direction: direction, duration: 700 , easing: effect_easing});
							else $("."+before_state.state+"-content").hide( "slide", { direction: direction, duration: 700 , easing: effect_easing});
							if(before_state.state == "works" || before_state.state == "works-view") {
								$(".works-content-category").hide( "slide", { direction: direction, duration: 700 , easing: effect_easing});
								$("#div_redbg_works").hide( "slide", { direction: direction, duration: 700, easing: effect_easing});
							}
							else if(before_state.state == "blog" || before_state.state == "blog-view") {
								$(".blog-content-menu").hide( "slide", { direction: direction, duration: 700 , easing: effect_easing});
								$("#div_redbg_blog").hide( "slide", { direction: direction, duration: 700, easing: effect_easing});
							}
							else {
								$("#div_redbg_"+before_state.state).hide( "slide", { direction: direction, duration: 700, easing: effect_easing});
							}
						}
					}
		
					if(current_state.state == "main") {
						div_textbg_image_resize(0);
						main_show();
					}
					else {
						if(before_state.depth == current_state.depth)  {
							if(current_state.state == "blog-view") $(".blog-view-page-content").show();
							else $("."+current_state.state+"-content").show();
							footer_show();
						}
						else {
							var direction = "right"; 
							if(before_state.depth > current_state.depth) direction = "left";

							if(current_state.state == "blog-view") $(".blog-view-page-content").show( "slide", { direction: direction, duration: 700 , easing: effect_easing}, footer_show);
							else $("."+current_state.state+"-content").show( "slide", { direction: direction, duration: 700 , easing: effect_easing}, footer_show);
							if(current_state.state == "works" || current_state.state == "works-view") {
								$(".works-content-category").show( "slide", { direction: direction, duration: 700 , easing: effect_easing});
								works_content_over_bar_resize();
								$("#div_redbg_works").show( "slide", { direction: direction, duration: 700, easing: effect_easing});
							}
							else if(current_state.state == "blog" || current_state.state == "blog-view") {
								$(".blog-content-menu").show( "slide", { direction: direction, duration: 700 , easing: effect_easing});
								blog_content_over_bar_resize();
								$("#div_redbg_blog").show( "slide", { direction: direction, duration: 700, easing: effect_easing});
							}
							else if(current_state.state == "contact") {
								map_initialize();
								$("#div_redbg_"+current_state.state).show( "slide", { direction: direction, duration: 700, easing: effect_easing});
							}
							else $("#div_redbg_"+current_state.state).show( "slide", { direction: direction, duration: 700, easing: effect_easing});
						}
					}
	
					if(before_state.state == "works-view") $(".works-view-content .content-body").empty();
					else if(before_state.state == "blog-view") $(".blog-view-page-content .content-body ul.blog-list").empty();
					
					move_complete_check = true;
				}, load_time);
			}
			else {
				if(current_state.state == "works") {
					if(before_state.category_id != current_state.category_id || before_state.offset != current_state.offset || before_state.search != current_state.search) {
						if(before_state.category_id != current_state.category_id) works_content_over_bar_change(before_state.category_id, current_state.category_id);
						if(before_state.category_id != current_state.category_id || before_state.search != current_state.search) $("ul.works-list").empty();
						if(before_state.category_id != current_state.category_id || before_state.search != current_state.search) view_works_list_all(current_state.category_id, current_state.offset, current_state.search);
						else if(before_state.offset < current_state.offset) view_works_list(current_state.category_id, current_state.offset, current_state.search);
						else view_works_list_back();
					}
				}
				if(current_state.state == "works-view") {
					$(".works-view-content .content-body").empty();
					view_works_view(current_state.view_id);
				}
				else if(current_state.state == "blog") {
					if(before_state.category_id != current_state.category_id || before_state.offset != current_state.offset) {
						if(before_state.category_id != current_state.category_id) {
							blog_content_over_bar_change(before_state.category_id, current_state.category_id);
							view_blog_archive_list(current_state.category_id);
						}
						if(before_state.category_id != current_state.category_id) {
							$(".blog-content ul.blog-list").empty();
							view_blog_list_all(current_state.category_id, current_state.offset);
						}
						else if(before_state.offset < current_state.offset) view_blog_list(current_state.category_id, current_state.offset);
						else view_blog_list_back();
					}
				}
			}
		}
	});
});
</script>
<script id="works_list" type="text/x-jquery-tmpl">
<li data-works-id="${id}" data-works-offset="${offset}" data-works-security="${security}">
	<div class="works-content-bar"></div>
	<div class="works-content-title">${title1}<br /> ${title2}</div>
	<div class="works-content-image">
		{{if new_view == "show"}}<div class="works-content-new"><img src="<?=IMG_DIR?>/works/icon_new.png" /></div>{{/if}}
		<img src="<?=IMG_DIR?>/common_1/loading_ani_gif.gif" class="works-content-load-image" />
		<img src="<?=UPLOAD_DIR?>/${image_file_name}" width="210px" height="190px" class="works-content-image-in" />
		<div class="works-content-over-bar"><img src="<?=IMG_DIR?>/common/sum_bg.png" width="212px" height="171px" /></div>
		{{if security == "lock"}}<div class="works-content-key"><img src="<?=IMG_DIR?>/works/key.png" width="27px" height="34px" /></div>{{/if}}
		<div class="works-content-key-box">
			<div class="works-content-key-box-close"><img src="<?=IMG_DIR?>/works/x_close.png" /></div>
			<div class="works-content-key-box-text">
			You are not allowed.<br />
			Put your password.
			</div>
			<div class="works-content-key-box-input">
			<input type="password" name="password" /><span>OK</span>
			</div>
		</div>
	</div>
</li>
</script>
<script id="blog_list" type="text/x-jquery-tmpl">
<li data-blog-id="${id}" data-blog-offset="${offset}">
	<div class="blog-view-title">${title}</div>
	<div class="blog-view-date">${date}</div>
	<div class="blog-view-content">{{html content}}</div>
	<div class="blog-view-share"><span>Share this page</span><img class="sns-scrap" data-sns-type="facebook" data-view-id="${id}" src="<?=IMG_DIR?>/works/icon_f.png" /><img class="sns-scrap" data-sns-type="twitter" data-view-id="${id}" src="<?=IMG_DIR?>/works/icon_t.png" /></div>
</li>
</script>
<script id="works_view_content" type="text/x-jquery-tmpl">
<div class="works-view-top">
<div class="works-view-bar"></div>
<div class="works-view-title1">${title1}</div>
<div class="works-view-title2">${title2}</div>
<div class="works-view-date">${date}</div>
<div class="works-view-bar-1"></div>
<ul class="works-view-etc">
	<li class="works-view-etc-name">Client</li>
	<li class="works-view-etc-name">Categories</li>
	<li class="works-view-etc-name">Tags</li>
	<li class="works-view-etc-name">Share this page</li>
	<li class="works-view-etc-value">${client}</li>
	<li class="works-view-etc-value works-view-category">{{html category_title}}</li>
	<li class="works-view-etc-value works-view-tag">{{html tag}}</li>
	<li class="works-view-etc-value"><img class="sns-scrap" data-sns-type="facebook" data-view-id="${id}" src="<?=IMG_DIR?>/works/icon_f.png" /><img class="sns-scrap" data-sns-type="twitter" data-view-id="${id}" src="<?=IMG_DIR?>/works/icon_t.png" /></li>
</ul>
<div class="works-view-bar-2"></div>
</div>
<div class="works-view-etc-content">{{html content}}</div>
<div class="works-view-relation">{{html relation}}</div>
<div class="works-view-bar-3"></div>
<ul class="works-list-back">
	<li class="works-list-newer-image"><img src="<?=IMG_DIR?>/common_1/icon_newer.png" /></li>
	<li class="works-list-newer-text" data-id="0"><span>Newer project</span></li>
	<li class="works-list-back-image"><img src="<?=IMG_DIR?>/common_1/icon_back.png" /></li>
	<li class="works-list-back-text">back to list</li>
	<li class="works-list-older-text" data-id="0"><span>Older project</span></li>
	<li class="works-list-older-image"><img src="<?=IMG_DIR?>/common_1/icon_older.png" /></li>
</ul>
<div class="works-view-bottom-top"><img src="<?=IMG_DIR?>/common_1/top.png" /></div>
<div class="works-view-bottom-block"></div>
</script>
<script id="blog_view_content" type="text/x-jquery-tmpl">
<li>
	<div class="blog-view-title">${title}</div>
	<div class="blog-view-date">${date}</div>
	<div class="blog-view-content">{{html content}}</div>
	<div class="blog-view-share"><span>Share this page</span><img class="sns-scrap" data-sns-type="facebook" data-view-id="${id}" src="<?=IMG_DIR?>/works/icon_f.png" /><img class="sns-scrap" data-sns-type="twitter" data-view-id="${id}" src="<?=IMG_DIR?>/works/icon_t.png" /></div>
</li>
</script>
<script id="works_content_category" type="text/x-jquery-tmpl">
<div class="works-content-category-name"><span>${title}</span><div class="works-content-category-over-bar category-${id} works-content-category-over-bar-hover"></div><img src="<?=IMG_DIR?>/common/1px.png" class="category-pointer" data-menu="${id}" /></div>
<div class="works-content-category-bar"></div>
</script>
<script id="blog_content_category" type="text/x-jquery-tmpl">
<div class="blog-content-category-name"><span>${title}</span><div class="blog-content-category-over-bar category-${id} blog-content-category-over-bar-hover"></div><img src="<?=IMG_DIR?>/common/1px.png" class="category-pointer" data-menu="${id}" /></div>
<div class="blog-content-category-bar"></div>
</script>
<script id="blog_content_archive" type="text/x-jquery-tmpl">
<div class="blog-content-archive-name"><span>${date_Y} (${count})</span></div>
<div class="blog-content-archive-bar"></div>
</script>
<script id="footer" type="text/x-jquery-tmpl">
<div class="footer">
	<div class="footer-bar main-background-color"></div>
	<ul class="inline">
		<li class="footer-logo"><img class="main-image-color" src="<?=IMG_DIR?>/common/f_logo<?=$cover_default['image_color']?>.png">
		</li>
		<li class="footer-address main-font-color">4F NUGA BLDG. 115-6 SAMSUNG-DONG  GANGNAM-GU, SEOUL, KOREA<br />
		T +82(0)2 512 8475      F +82(0)2 512 8476 
		</li>
		<li class="footer-contact main-font-color">CONTACT@SWITCHMW.COM<br />
		JOB@SWITCHMW.COM
		</li>
		<li class="footer-social">
			<div class="footer-social-text main-font-color">SWITCHMEDIAWORKS © 2013</div>
			<div class="social-box">
				<img class="footer_f main-image-color" src="<?=IMG_DIR?>/main_1/footer_f<?=$cover_default['image_color']?>.png">
				<!--img class="footer_t main-image-color" src="<?=IMG_DIR?>/main_1/footer_t<?=$cover_default['image_color']?>.png"-->
				<img class="footer_v main-image-color" src="<?=IMG_DIR?>/main_1/footer_v<?=$cover_default['image_color']?>.png">
			</div>
			<div class="footer-like"><div class="fb-like" data-send="false" data-layout="button_count" data-width="100" data-show-faces="false"></div></div>
		</li>
	</ul> 
</div>
</script>
<?php include('footer.php');?>